This is my js:

import React from './node_modules/react';
import ReactDOM from './node_modules/react-dom';

let thePage = React.createElement(
  'main',
  null,
  'lol'
);

ReactDOM.render(thePage, document.getElementById('app'));

But when I open its associated HTML page in my browser, I get this error:

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

Here's what my React folder looks like for reference: Link

Oh and the html and js files are in the 'my-app' folder.

It occurred to me that there doesn't seem to be a "react.js" or any such file, but I've tried reinstalling it and that's always what it es out as, so I don't know if that's an issue or not.

Any idea how I can fix this error? What am I doing wrong?

This is my js:

import React from './node_modules/react';
import ReactDOM from './node_modules/react-dom';

let thePage = React.createElement(
  'main',
  null,
  'lol'
);

ReactDOM.render(thePage, document.getElementById('app'));

But when I open its associated HTML page in my browser, I get this error:

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

Here's what my React folder looks like for reference: Link

Oh and the html and js files are in the 'my-app' folder.

It occurred to me that there doesn't seem to be a "react.js" or any such file, but I've tried reinstalling it and that's always what it es out as, so I don't know if that's an issue or not.

Any idea how I can fix this error? What am I doing wrong?

• javascript
• reactjs

Share Improve this question Follow asked Jun 26, 2021 at 21:52 yeahwoopsyeahwoops 2111 gold badge11 silver badge22 bronze badges 3

• 1 You shouldn't need the node_modules in the path. – Matt Commented Jun 26, 2021 at 22:06
• @mkaatman That's the folder it's in though. If I leave it out, the browser tells me it can't find it. – yeahwoops Commented Jun 26, 2021 at 22:21
• Are you using webpack? Webpack will pile everything into a minified bundle. – Matt Commented Jun 27, 2021 at 23:37

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

Just clean cache and cookies. Then forces refresh. That solves the problem for me.

You are probably not starting the application like you should (double-clicking on the index.html file?)

If you used react-scripts in order to create the app (like you probably should if you're a beginner), then use npm run start which will pile the code and the imports into one JavaScript bundle file and start a web page on http://localhost:3000

This will allow regular imports to work properly:

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

And when deploying to a remote web server, use npm run build and copy the content of the build folder to the server.

most likely scenario here is it can't find the script file so the script fetch is returning a 404 which would be a text page saying it cant find it.

Double check the location in the index.html is what it should be