無法啟動 React 項目

Question

賞金將在 4 天后到期。 此問題的答案有資格獲得+50聲望賞金。 user5798214正在尋找規范的答案。

我已經開始學習 React 項目。 我的項目運行成功，但由於其他一些項目，我不得不降低 Node 版本。 之后它不起作用。 因此，我使用git bash安裝了 NVM 並安裝了 React 項目所需的 Node 版本。 問題是項目還沒有啟動。

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 檔案：

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

嘗試完全重新安裝 Node：

https://www.mend.io/free-developer-tools/blog/reinstall-npm-node.js/在源代碼的簡短部分，您可以使用：Node 安裝程序、Node.js 或 Homebrew。

完成這些步驟后，只需提前 go 並一如既往地安裝所有需要的版本，但請注意您現在必須在本地安裝舊版本。

並為將來記住，只需通過 NVM 安裝所有特定版本，就不會立即影響您所有其他項目的風險。

Answer 2

請檢查公用文件夾和 index.html 在您的項目根文件夾中是否有效。 使用nvm use（node版本）切換node版本后，刪除package-lock.json和node_modules文件夾，運行npm install。