bug: Cannot access ambient const enums when the '--isolatedModules' flag is provided

[rsmelo92]

Prequisites

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

Stencil Version

v2.8.0

Current Behavior

When setting isolatedModules on typescript, after updating it to v2.8.0, it stopped building

On another project this is the error:

Expected Behavior

it should keep working after updating it

Steps to Reproduce

• clean all builds on new stencil version
• go to tsconfig.json and set "isolatedModules": true
• run stencil build

Code Reproduction URL

https://github.com/rsmelo92/stencil-bug-ts

Additional Information

This has a explanation of the issue https://stackoverflow.com/a/62175702/7986262

Heres a detailed explanation of the isolatedModules option https://www.typescriptlang.org/tsconfig#isolatedModules

[rwaskiewicz]

👋 Hey @rsmelo92

Thanks for the detailed explanation & repro case! I was able to pull it down and validate that this indeed does throw one of the errors that you mentioned: Re-exporting a type when the '--isolatedModules' flag is provided requires using 'export type'. Based on the TypeScript documentation you linked, this appears to be functioning as expected:

In TypeScript, you can import a type and then subsequently export it:

import { someType, someFunction } from "someModule";

someFunction();

export { someType, someFunction };

Because there’s no value for someType, the emitted export will not try to export it (this would be a runtime error in JavaScript):

export { someFunction };

Single-file transpilers don’t know whether someType produces a value or not, so it’s an error to export a name that only refers to a type.

So while this is an annoyance, I believe this is working as intended. That said, I do wonder if it would be beneficial for components.d.ts to always generate:

- export { Components, JSX } from './components';
+ export type { Components, JSX } from './components';

I'm going to mark this issue as something the team should further investigate during our normal sprint cycles.

As far as your second error message is concerned, can you please open a second issue containing a reproduction for how you're accessing those ambient const enums?

[rwaskiewicz]

If you could share the version of Stencil you're upgrading from, that'd also be a big help! Thanks!

[rsmelo92]

hey @rwaskiewicz thanks for the answer! the version I upgraded from was 2.7.0

can you please open a second issue containing a reproduction for how you're accessing those ambient const enums?

I will try, but it's not going to be easy, as we have a huge codebase here... It seems to me that we are not using any enum directly, but some stenciljs generated code is. I will debug it and open a new issue. Thanks!

[ionitron-bot[bot]]

Thanks for the issue! This issue is being closed due to inactivity. If this is still an issue with the latest version of Stencil, please create a new issue and ensure the template is fully filled out.

Thank you for using Stencil!

[rwaskiewicz]

Sorry about that, this issue shouldn't have been closed. It's been triaged and is on our backlog....I'm reserving some time this week to rework this bot, this isn't the first time this has happened. Thanks for your understanding!

[rwaskiewicz]

Hey @rsmelo92,

Starting with https://github.com/ionic-team/stencil-component-starter/commit/938bc8f333cf837b8e8f739afb770366e6720c73, we now generate Stencil component libraries with an index.ts file like so:

export * from './components';

which doesn't require us to explicitly put the type modifier in our import statement. This is beneficial for projects that might be connected to TypeScript v4.1 and prior, who can't make use of this export type { Components, JSX } from './components'; syntax.

I pulled down the reproduction case and modified it like so:

diff --git a/stencil-bug/src/index.ts b/stencil-bug/src/index.ts
index 7531c10..07635cb 100644
--- a/stencil-bug/src/index.ts
+++ b/stencil-bug/src/index.ts
@@ -1 +1 @@
-export { Components, JSX } from './components';
+export * from './components';

and was able to confirm this does indeed fix the issue.

I'm going to close this as a result, but feel free to open a new issue if you feel this doesn't resolve the original issue