React 应用程序因子编译和 webpack 错误而中断

Question

I just finished the ReactJS.org tutorial and it was functional. Then I added a bunch of comments to explain each block of code, closed down the local server, and went home. When I re-opened it to start tweaking it and trying advanced options, it broke, with several errors (webpack, eslint, child compilation failed...). The only thing that changed was a VS Code update.

The main error seems to be related to webpack, but I don't have a webpack config file, and I'm not using it to my knowledge. I used create-react-app to build the app, and deleted the files in the src/ directory to start from scratch like the tutorial says to do.

Errors: (see image)

• When doing npm start , it says 1 ERROR in child compilations... in the terminal
• Must use import to load ES module...
• Child compilation failed...

Troubleshooting:

• I removed and re-inserted ESLint config options in package.json
• I tried npm uninstall eslint
• Did a git checkout of the previous commit (the finished tutorial) which was functional, but it's broken now
• Also did an npm ls for reference (see images)

Answer 1

I have reproduced this problem, but my problem is that I created a project based on create-react-app in the V16.* version of Node, but I ran it with the V12.* version of Node. So when I re-run the 16.* version it will work, hopefully that will help you