React Error: Child compilation failed: Must use import to load ES Module

Question

我已经在我的 ubuntu 系统上完成了一个反应项目并上传到 github，现在我正在我的 windows 系统上克隆相同的存储库并执行 npm install 和 npm start .它显示此错误。

检查这些图片 [1]: https://i.stack.imgur.com/3cKFp.png [2]: https://i.stack.imgur.com/v5OHz.png

我对反应有点陌生所以请帮我解决这个问题。我在 windows 上的 npm 版本是 8.7.0，node 版本是 v12.16.3

 Compiled with problems:X 
ERROR

Must use import to load ES Module: C:\Users\user\Desktop\port\frontend\node_modules\@eslint\eslintrc\universal.js
require() of ES modules is not supported.
require() of C:\Users\user\Desktop\port\frontend\node_modules\@eslint\eslintrc\universal.js from C:\Users\user\Desktop\port\frontend\node_modules\eslint\lib\linter\linter.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename universal.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from C:\Users\user\Desktop\port\frontend\node_modules\@eslint\eslintrc\package.json.


ERROR

  Error: Child compilation failed:
  Must use import to load ES Module: C:\Users\user\Desktop\port\frontend\node_modules\@eslint\eslintrc\universal.js
  require() of ES modules is not supported.
  require() of C:\Users\user\Desktop\port\frontend\node_modules\@eslint\eslintrc\universal.js from C:\Users\user\Desktop\port\frontend\node  _modules\eslint\lib\linter\linter.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module"   which defines all .js files in that package scope as ES modules.
  Instead rename universal.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from C:\Users\user\Desk  top\port\frontend\node_modules\@eslint\eslintrc\package.json.
  
  - child-compiler.js:169 
    [frontend]/[html-webpack-plugin]/lib/child-compiler.js:169:18
  
  - Compiler.js:564 
    [frontend]/[webpack]/lib/Compiler.js:564:11
  
  - Compiler.js:1183 
    [frontend]/[webpack]/lib/Compiler.js:1183:17
  
  
  - Hook.js:18 Hook.CALL_ASYNC_DELEGATE [as _callAsync]
    [frontend]/[tapable]/lib/Hook.js:18:14
  
  - Compiler.js:1179 
    [frontend]/[webpack]/lib/Compiler.js:1179:33
  
  - Compilation.js:2784 finalCallback
    [frontend]/[webpack]/lib/Compilation.js:2784:11
  
  - Compilation.js:3089 
    [frontend]/[webpack]/lib/Compilation.js:3089:11
  
  
  - Hook.js:18 Hook.CALL_ASYNC_DELEGATE [as _callAsync]
    [frontend]/[tapable]/lib/Hook.js:18:14

Answer 1

答案就在错误本身。您在通用 js 中使用的 require 不受支持，请改用 import

Answer 2

看来你的节点版本有问题。节点版本 16 上的大部分反应组件运行。升级您的节点版本，我认为它会解决您的问题。

React Error: Child compilation failed: Must use import to load ES Module

React Error: Child compilation failed: Must use import to load ES Module

javascript

runtime-error

compiler-errors

reactjs

webpack