Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[TS] Cannot re-export a type when the --isolatedModules flag is provided #6054

Closed
ChristianIvicevic opened this issue Dec 17, 2018 · 3 comments

Comments

@ChristianIvicevic
Copy link

Is this a bug report?

No

Description

Previously I used the following file structure for components:

FooComponent/
|- FooComponent.module.scss
|- FooComponent.tsx
|- index.tsx

In my FooComponent.tsx I'd basically define the following:

export interface IFooComponentProps { /* ... */ }
export function FooComponent(props: IFooComponentProps) { /* ... */ }

Furthermore I'd re-export the types in index.tsx as follows:

export { FooComponent, IFooComponentProps } from "./FooComponent";

Unfortunately CRA does not allow me to disable isolatedModules in the tsconfig.json and the compiler is complaining about re-exporting IFooComponentProps. In my use case I have an IFooComponentProps[] in another file that I am using to dynamically create FooComponents. It seems I have to move my props interface into separate files (especially when I use stateful components) which is just unnecessarily increasing the amount of files.

I'd like to know why CRA is enforcing isolatedModules (even automatically writing it to the config if I remove it manually) and how I may fix my design.

@heyimalex
Copy link
Contributor

Babel is used to compile typescript, but requires isolatedModules to be true. Typescript won't let you re-export types when isolatedModules is true because of this. There's your explanation at least.

@ChristianIvicevic
Copy link
Author

I came across a workaround that is really weird to me. Writing export * from "./FooComponent"; allows me to re-export and use the classes and interfaces once again. It seems arbitrary that this works but it serves its purposes in my case.

@lock lock bot locked and limited conversation to collaborators Jan 8, 2019
@heyimalex
Copy link
Contributor

I'll add that you can kinda do the same thing by manually exporting an alias to the type. Kinda annoying, and maybe there's a better way, but it's what I'm doing when I need it.

import { SomeType } from "./types";
// export { SomeType };
export type SomeType = SomeType;

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants