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

.mjs node module not working after eject #3520

Closed
Kingdutch opened this issue Nov 29, 2017 · 6 comments
Closed

.mjs node module not working after eject #3520

Kingdutch opened this issue Nov 29, 2017 · 6 comments

Comments

@Kingdutch
Copy link

Is this a bug report?

Yes

Can you also reproduce the problem with npm 4.x?

Unsure, using yarn 0.27.5

Which terms did you search for in User Guide?

webkit, constructor

Uncaught TypeError: __WEBPACK_IMPORTED_MODULE_1_universal_router___default.a is not a constructor

Environment

  1. node -v: v8.2.1
  2. npm -v: 5.3.0
  3. yarn --version (if you use Yarn): 0.27.5
  4. npm ls react-scripts (if you haven’t ejected): [ejected]

Then, specify:

  1. Operating system: Mac OS X High Sierra
  2. Browser and version (if relevant):
    Chrome Version 62.0.3202.94 (Official Build) (64-bit)

Steps to Reproduce

(Write your steps here:)

  1. Use create-react-app to create a new react app
  2. Eject the react app
  3. Install "Universal Router" using yarn (yarn add universal-router)
  4. Add the following lines to your src/index.js
import UniversalRouter from 'universal-router';
console.log(UniversalRouter);
const router = new UniversalRouter([]);

Expected Behavior

The console output should show that UniversalRouter is a proper constructor function and no errors should occur.

Actual Behavior

The console outputs /static/media/browser.99d6d764.mjs and the following error is shown:
TypeError: __WEBPACK_IMPORTED_MODULE_1_universal_router___default.a is not a constructor

image

Possible fix

I found that the following fixed this for me:
On line 201 of the generated webpack.config.dev.js replace:
exclude: [/\.js$/, /\.html$/, /\.json$/],
with
exclude: [/\.m?js$/, /\.html$/, /\.json$/],

This might also need to be done for the .prod version.

@Kingdutch
Copy link
Author

Should've mentioned that this was originally implemented in #3237

@Timer
Copy link
Contributor

Timer commented Nov 30, 2017

So does jsx suffer from this as well?

@iansu
Copy link
Contributor

iansu commented Dec 1, 2017

Is anyone working on this? If not then I'd like to look into it.

@Timer
Copy link
Contributor

Timer commented Dec 1, 2017

Go ahead @iansu

@Kingdutch
Copy link
Author

Didn't have time to go after this earlier.

If I rename a .js file that I include to a .jsx then I end up with the same error as in my original report. If I then change the m?js to m?jsx? it'll correctly match the extension and parse again and that seems to fix the issue.

@gaearon
Copy link
Contributor

gaearon commented Jan 15, 2018

This is out in react-scripts@1.1.0! Please let us know if something doesn’t quite work.
https://github.com/facebookincubator/create-react-app/releases/tag/v1.1.0

@lock lock bot locked and limited conversation to collaborators Jan 20, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

4 participants