bug: Rollup Fails to Process .mts Files After Latest StencilJS Update

[a7medm7med]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Stencil Version

4.28.0

Current Behavior

After updating to the latest StencilJS version, which includes an upgrade to the latest Rollup version, Rollup no longer processes .mts files correctly. This issue affects our setup using @floating-ui and i18next. The same configuration worked fine in previous StencilJS versions.

Expected Behavior

To support .mts files like previous versions

System Info

No response

Steps to Reproduce

• Update StencilJS to the latest version, which includes the Rollup upgrade.
• Use a project that includes .mrt files (e.g., when using @floating-ui or i18next).
• Run the StencilJS build process.
• Observe that Rollup fails to process .mts files, causing the build to break.

Code Reproduction URL

https://github.com/a7medm7med/stencils-rollup-issue

Additional Information

No response

[johnjenkins]

Hi @a7medm7med - thanks for raising. Do you mind putting together a minimum reproduction 🙏?
(I have no idea what a mrt file is 😄)

[a7medm7med]

@johnjenkins Sorry, I meant module TypeScript files (.mts).

Here's a reproduction of the issue:
https://github.com/a7medm7med/stencils-rollup-issue

Important: This issue occurs when "moduleResolution" is set to "bundler" but does not happen when it's set to "node".

With "bundler", TypeScript resolves .d.mts files, whereas with "node", it resolves .d.ts files.

[a7medm7med]

@johnjenkins @christian-bromann

Great work! However, in our main project, the build process gets stuck at "generate lazy started ..." without any warnings or errors.

This issue does not occur in the reproduction repo, and I can't figure out why it happens in our main project.

For now, we've downgraded StencilJS back to v27 until we can determine the cause. Once we understand the issue, I'll open a new issue.

Any insights from you guys would be greatly appreciated in helping us figure out this!

[johnjenkins]

@a7medm7med - sorry 😔 no real insights

Could you run with the —debug flag; perhaps it shows something

[a7medm7med]

UPDATE:

We've been checking each component to identify the issue and found that it's caused by our date-time-field component, which uses dayjs.

The problem occurs due to how we import dayjs locales:

async connectedCallback() {
    await import('dayjs/locale/af');
    await import('dayjs/locale/am');
    await import('dayjs/locale/ar-dz');
    await import('dayjs/locale/ar-iq');
    await import('dayjs/locale/ar-kw');
    await import('dayjs/locale/ar-ly');
    await import('dayjs/locale/ar-ma');
    await import('dayjs/locale/ar-sa');
    await import('dayjs/locale/ar-tn');
    await import('dayjs/locale/ar');
    await import('dayjs/locale/az');
    await import('dayjs/locale/be');
    await import('dayjs/locale/bg');
    await import('dayjs/locale/bi');
    await import('dayjs/locale/bm');
    await import('dayjs/locale/bn-bd');
    await import('dayjs/locale/bn');
    await import('dayjs/locale/bo');
    await import('dayjs/locale/br');
    await import('dayjs/locale/bs');
}

When we try to exit the process, we get an error, but we still can't determine whether the issue is caused by dayjs or Rollup.

generate lazy + source maps finished in 2.75 s

[ ERROR ]  Rollup
           Unexpected early exit. This happens when Promises returned by plugins cannot resolve. Unfinished hook
           action(s) on exit: (commonjs) shouldTransformCachedModule "example-date-time-field.entry" (commonjs)
           shouldTransformCachedModule
           "C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/src/components/button/button.tsx"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/ar-kw.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/ar-iq.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/af.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/am.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/ar-ly.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/ar.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/ar-tn.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/ar-ma.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/az.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/ar-sa.js?commonjs-es-import"
           (commonjs) load
           "\u0000C:/Users/a7med/OneDrive/Desktop/stencil-bug-3-main/stencil-bug-3-main/node_modules/.pnpm/[email protected]/node_modules/dayjs/locale/ar-dz.js?commonjs-es-import"

[59:57.4]  rebuild failed, watching for changes... in 2.76 s

[mynamespace]

@a7medm7med same problem here, it seems to be related to dayjs

[johnjenkins]

@mynamespace / @a7medm7med could you make a minimum repro with dayjs? 🙏

[a7medm7med]

@johnjenkins

Here's the repo:

https://github.com/a7medm7med/stencils-dayjs-issue/upload

Then, try saving any file other than the component file (button.tsx). For example, modify and save stencil.config.ts or index.html. You'll notice that the compiler gets stuck at "generate lazy + source maps started ...".

In our main project, running:

pnpm run start

doesn't even start the dev server and the compiler is stuck at "generate lazy started ..."

[mynamespace]

why did this was closed? the problem is still present in 4.31.0, I'm stuck at 4.27.0.

[christian-bromann]

@mynamespace can you raise a new issue with a reproduction case? Thank you!