reactjswebpackwebpack-cliwebpack-bundle-analyzer

Why does webpack not like React.StrictMode


When I run npx webpack-cli --analyze --node-env development I get an error about it not liking <React.StrictMode>:

Webpack Bundle Analyzer is started at http://127.0.0.1:8888
Use Ctrl+C to close it
Hash: 24852f2f5b5cef02cfe2
Version: webpack 4.42.0
Time: 57ms
Built at: 08/11/2021 2:53:12 PM
  Asset      Size  Chunks             Chunk Names
main.js  4.09 KiB    main  [emitted]  main
Entrypoint main = main.js
[./src/index.js] 316 bytes {main} [built] [failed] [1 error]

ERROR in ./src/index.js 9:2
Module parse failed: Unexpected token (9:2)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|
| ReactDOM.render(
>   <React.StrictMode>
|     <App />
|   </React.StrictMode>,

I am using the default config from .\node_modules\react-scripts\config\webpack.config.js. Why does webpack not like React.StrictMode?


Solution

  • I found an answer, just use source-map-explorer instead:

    "scripts": {
        "start": "rimraf ./build && react-scripts start",
        "build": "react-scripts build",
        "analyze": "source-map-explorer 'build/static/js/*.js'",
        "test": "cross-env CI=true react-scripts test --env=jsdom",
        "eject": "react-scripts eject",
        "lint": "eslint ./src/"
      },