无法启动 React 项目

Question

. Answers to this question are eligible for a +50 reputation bounty. user5798214 is looking for a .

I have started learning React project. My project was running successfully but due to some other project I have to lower down the Node version. After that it doesn't work. So, I installed NVM and installed the Node version which needed for the React project using git bash . The problem is project still not started.

npm verb cli C:\Users\faf\.nvm\versions\node\v18.12.1\bin\node.exe C:\Users\faf\.nvm\versions\node\v18.12.1\bin\node_modules\npm\bin\npm-cli.js
npm info using npm@8.19.2
npm info using node@v18.12.1
npm timing npm:load:whichnode Completed in 3ms
npm timing config:load:defaults Completed in 3ms
npm timing config:load:file:C:\Users\faf\.nvm\versions\node\v18.12.1\bin\node_modules\npm\npmrc Completed in 15ms
npm timing config:load:builtin Completed in 16ms
npm timing config:load:cli Completed in 5ms
npm timing config:load:env Completed in 4ms
npm timing config:load:file:C:\Users\faf\OneDrive - TEST\Desktop\ReactJS\.npmrc Completed in 3ms
npm timing config:load:project Completed in 61ms
npm timing config:load:file:C:\Users\faf\.npmrc Completed in 7ms
npm timing config:load:user Completed in 7ms
npm timing config:load:file:C:\Users\afa\.nvm\versions\node\v18.12.1\bin\etc\npmrc Completed in 6ms
npm timing config:load:global Completed in 6ms
npm timing config:load:validate Completed in 3ms
npm timing config:load:credentials Completed in 2ms
npm timing config:load:setEnvs Completed in 3ms
npm timing config:load Completed in 113ms
npm timing npm:load:configload Completed in 114ms
npm timing npm:load:mkdirpcache Completed in 5ms
npm timing npm:load:mkdirplogs Completed in 4ms
npm verb title npm start
npm verb argv "start" "--loglevel" "verbose"
npm timing npm:load:setTitle Completed in 3ms
npm timing config:load:flatten Completed in 7ms
npm timing npm:load:display Completed in 14ms
npm verb logfile logs-max:10 dir:C:\Users\faf\AppData\Local\npm-cache\_logs
npm verb logfile C:\Users\faf\AppData\Local\npm-cache\_logs\2023-01-25T14_47_05_872Z-debug-0.log
npm timing npm:load:logFile Completed in 21ms
npm timing npm:load:timers Completed in 0ms
npm timing npm:load:configScope Completed in 0ms
npm timing npm:load Completed in 167ms

> reactjs@1.0.0 start
> webpack-dev-server --mode development --open --hot

<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:3000/
<i> [webpack-dev-server] Content not from webpack is served from 'C:\Users\faf\OneDrive - TEST\Desktop\ReactJS\public' directory
<i> [webpack-dev-server] 404s will fallback to '/index.html'
AssignProcessToJobObject: (6) The handle is invalid.
npm timing command:run-script Completed in 35919ms
npm timing command:start Completed in 35974ms
npm verb exit 2147483651
npm timing npm Completed in 36207ms
npm verb code 2147483651

Webpack file:

const path = require('path');  
const HtmlWebpackPlugin = require('html-webpack-plugin');  
  
module.exports = {  
   entry: './src/index.js',  
   output: {  
      path: path.join(__dirname, '/bundle'),  
      filename: 'index_bundle.js'  
   },  
   devServer: {
      // static: path.join(__dirname, 'public/'),
      // devMiddleware: {
      //   publicPath: '/dist/'
      // },
      port: 3000,
      hot: "only",
      historyApiFallback: true
    },
   module: {  
      rules: [  
         {  
            test: /\.jsx?$/,  
            exclude: /node_modules/,  
        use: {  
              loader: "babel-loader",  
            }  
         },
         {
            test: /\.(css|sass|scss)$/,
            use: [
              {
                loader: 'style-loader'
              },
              {
                loader: 'css-loader'
              },
              {
                loader: 'sass-loader'
              }
            ]
          }  
      ]  
   },  
   plugins:[  
      new HtmlWebpackPlugin({  
         template: './src/index.html'  
      })  
   ]  
}  

Answer 1

Try to reinstall Node fully:

https://www.mend.io/free-developer-tools/blog/reinstall-npm-node.js/ Shortly of the source, you can do it using: Node installer, Node.js or Homebrew.

After these steps done just go ahead and install all versions needed in as always way but mention that u must do the old version install locally now.

And memorize for the future, just install all specific version via NVM to not affect with risk all your other project at once.

Answer 2

Please check public folder and index.html is valid in your project root folder. After switching node version using nvm use (node version), delete package-lock.json and node_modules folder, and run npm install.