npm run build的react-scripts问题

Question

我们在生产设置上运行命令npm run build （构建项目的前端）时npm run build这些错误（DevOps团队报告的错误，不确定在删除依赖关系react-scripts后是否尝试过此错误。Package.json复制在下面） -

> mvc-panel@0.1.0 build /usr/local/mvc/releases/2017-10-23-17:00/mvc_build/panel/mvc-panel
> react-scripts build

sh: react-scripts: command not found

npm ERR! Linux 3.10.0-327.36.3.el7.x86_64
npm ERR! argv "/root/.nvm/versions/node/v7.2.1/bin/node" "/root/.nvm/versions/node/v7.2.1/bin/npm" "run" "build"
npm ERR! node v7.2.1
npm ERR! npm  v3.10.10
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! mvc-panel@0.1.0 build: `react-scripts build`
npm ERR! spawn ENOENT
npm ERR! 
npm ERR! Failed at the mvc-panel@0.1.0 build script 'react-scripts build'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the mvc-panel package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     react-scripts build
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs mvc-panel
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls mvc-panel
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /usr/local/mvc/releases/2017-10-23-17:00/mvc_build/panel/mvc-panel/npm-debug.log

在安装react-scripts之后，我们面临这些错误

/root/.nvm/versions/node/v7.2.1/bin/react-scripts -> /root/.nvm/versions/node/v7.2.1/lib/node_modules/react-scripts/bin/react-scripts.js

> uglifyjs-webpack-plugin@0.4.6 postinstall /root/.nvm/versions/node/v7.2.1/lib/node_modules/react-scripts/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js

module.js:472
    throw err;
    ^

Error: Cannot find module '/root/.nvm/versions/node/v7.2.1/lib/node_modules/react-scripts/node_modules/uglifyjs-webpack-plugin/lib/post_install.js'
    at Function.Module._resolveFilename (module.js:470:15)
    at Function.Module._load (module.js:418:25)
    at Module.runMain (module.js:605:10)
    at run (bootstrap_node.js:427:7)
    at startup (bootstrap_node.js:151:9)
    at bootstrap_node.js:542:3
/root/.nvm/versions/node/v7.2.1/lib
└── (empty)

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.2 (node_modules/react-scripts/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules/react-scripts/node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm ERR! Linux 3.10.0-327.36.3.el7.x86_64
npm ERR! argv "/root/.nvm/versions/node/v7.2.1/bin/node" "/root/.nvm/versions/node/v7.2.1/bin/npm" "install" "-g" "react-scripts"
npm ERR! node v7.2.1
npm ERR! npm  v3.10.10
npm ERR! code ELIFECYCLE

npm ERR! uglifyjs-webpack-plugin@0.4.6 postinstall: `node lib/post_install.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the uglifyjs-webpack-plugin@0.4.6 postinstall script 'node lib/post_install.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the uglifyjs-webpack-plugin package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node lib/post_install.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs uglifyjs-webpack-plugin
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls uglifyjs-webpack-plugin
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /usr/local/mvc/releases/2017-10-23-17:00/mvc_build/panel/mvc-panel/node_modules/npm-debug.log
npm ERR! code 1

以下是package.json文件-

{
  "name": "mvc-panel",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "bootstrap": "^3.3.7",
    "jquery": "^3.2.1",
    "material-ui": "^0.18.3",
    "qs": "^6.4.0",
    "react": "^15.5.4",
    "react-alert": "^2.1.2",
    "react-bootstrap-table": "^3.4.1",
    "react-dom": "^15.5.4",
    "react-loader": "^2.4.2",
    "react-router-dom": "^4.1.1",
    "react-tap-event-plugin": "^2.0.1",
    "serve": "^6.0.0"
  },
  "devDependencies": {
    "datatables.net": "^1.10.15",
    "jquery": "^3.2.1",
    "react-scripts": "1.0.7"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

以前，我们尝试在登台服务器上进行构建时获得了以下内容-

> mvc-panel@0.1.0 build D:\Sandeepan\Payu MVC\backend codebase\MVC2.0\panel\mvc-
panel
> react-scripts build

Creating an optimized production build...
Failed to compile.

Module not found: Error: Can't resolve './../common/panelConfig.js' in 'D:\Sande
epan\Payu MVC\backend codebase\MVC2.0\panel\mvc-panel\src\components'


npm ERR! Windows_NT 6.1.7601
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\
node_modules\\npm\\bin\\npm-cli.js" "run" "build"
npm ERR! node v6.11.2
npm ERR! npm  v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! mvc-panel@0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the mvc-panel@0.1.0 build script 'react-scripts build'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the mvc-panel package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     react-scripts build
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs mvc-panel
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls mvc-panel
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     D:\Sandeepan\Payu MVC\backend codebase\MVC2.0\panel\mvc-panel\npm-d
ebug.log

看来他们已经通过执行rm -rf reacts-scripts来解决这个问题，但我无法验证同样的结果。 我尝试通过删除整个node_modules目录并运行以下命令-

npm install 
npm install -g serve 
npm run build

但是仍然出现相同的错误。

我在代码库中查找了“ ./../common/panelConfig.js”，并在组件目录中找到了许多文件，包括像这样的文件-

var panelConfig = require('./../common/panelConfig.js');

如果我将其更改为（点击并试用）-

var panelConfig = require(__dirname+'/../common/panelConfig.js');

我仍然在构建时遇到以下错误-

Module not found: Error: Can't resolve 'D:\Sandeepan\Payu MVC\backend codebase\M
VC2.0\panel\mvc-panel\src\components/../common/panelConfig.js' in 'D:\Sandeepan\
Payu MVC\backend codebase\MVC2.0\panel\mvc-panel\src\components'

有人可以指点一下吗。

Answer 1

首先，这里有两个不同的问题，最好将它们分开。

对于您的第一个问题， Error: Cannot find module表示软件包已丢失或未正确安装。 在大多数情况下，一旦删除node_modules并重新安装，它就会得到解决。

关于此错误uglifyjs-webpack-plugin/lib/post_install.js ，我看到react-scripts软件包已固定为1.0.7版本。 我使用最新版本1.0.14进行了试用，对我来说效果很好。 在版本之前用^更新您的package.json以自动安装最新版本

"react-scripts": "^1.0.7"

另一种方法是一种临时解决方案，我曾经通过安装该软件包的beta版本来解决它。 您可以使用以下命令进行尝试。

npm i -D uglifyjs-webpack-plugin@beta

谈到第二个问题，

反斜杠'/'随您使用的操作系统而异，例如Windows使用反斜杠'\\'而其余OS后面跟着正斜杠'/' ，这会导致参考错误。

var panelConfig = require('./../common/panelConfig.js'); 这似乎很好。 您确定所提到的路径中存在panelConfig.js文件吗？ 如果没有请通过适当的途径require 。 希望这能解决您的参考问题。