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

example template should enable ES module interop #538

Open
slikts opened this issue Mar 4, 2020 · 4 comments
Open

example template should enable ES module interop #538

slikts opened this issue Mar 4, 2020 · 4 comments
Labels
scope: templates Related to an init template, not necessarily to core (but could influence core)

Comments

@slikts
Copy link

slikts commented Mar 4, 2020

Currently the React template uses the non-standard TS default import syntax:

import * as React from 'react';
import * as ReactDOM from 'react-dom';

This is unnecessarily confusing for users and exists in the language for legacy reasons, and instead the esModuleInterop compiler option should be used that enables just using standard ES6 default import syntax:

import React from 'react';
import ReactDOM from 'react-dom';

The main tsconfig.json already has esModuleInterop enabled, but the Parcel example even disables allowSyntheticDefaultImports for some reason.

@agilgur5
Copy link
Collaborator

agilgur5 commented Mar 4, 2020

Yea the tsconfig.json of the example is a weird one. It's over a year old and not sure if @jaredpalmer did that intentionally or it was just copied from somewhere.
I agree that esModuleInterop should be enabled by default, especially for consistency with the root config and tsc --init.

Would you like to submit a PR to fix that? I think it'd be ideal if it extended the root config and did any necessary overrides to be more explicit

I personally agree on the default import as well and think a PR for that would be good too.
Though that syntax hasn't been formally deprecated afaik, and is still used in official TS docs (despite tsc --init enabling esModuleInterop), which really creates some continued, strong confusion about it.

@agilgur5
Copy link
Collaborator

So this was actually discussed and rejected in #152 .
I don't have full context on all the nuances there, perhaps there's something we missed that this configuration actually makes sense

@jaredpalmer
Copy link
Owner

Actually, React just changed its import on Facebook dot com to be import * as React everywhere recently. It is (going to be?) the correct way to import React

@agilgur5 agilgur5 changed the title The React templates should use standard default import syntax, and the example should enable ES module interop example template should enable ES module interop Apr 11, 2020
@agilgur5 agilgur5 added the scope: templates Related to an init template, not necessarily to core (but could influence core) label Apr 12, 2020
@agilgur5
Copy link
Collaborator

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
scope: templates Related to an init template, not necessarily to core (but could influence core)
Projects
None yet
Development

No branches or pull requests

3 participants