JavaScript：解决意外字符“#”

2024-05-08

介绍

我的 React 应用程序可以执行npm run build在开发模式下（webpack.config.dev.js）但不在生产模式下（webpack.config.prod.js）。抛出以下错误：

Module parse failed: ...\node_modules\npm\bin\npm-cli.js Unexpected character '#' (1:0)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected character '#' (1:0)
    at Parser.pp$4.raise (...\node_modules\webpack\node_modules\acorn\dist\acorn.js:2221:15)
    at Parser.pp$7.getTokenFromCode (...\node_modules\webpack\node_modules\acorn\dist\acorn.js:2756:10)
    at Parser.pp$7.readToken (...\node_modules\webpack\node_modules\acorn\dist\acorn.js:2477:17)
    at Parser.pp$7.nextToken (...\node_modules\webpack\node_modules\acorn\dist\acorn.js:2468:15)
    at Parser.parse (...\node_modules\webpack\node_modules\acorn\dist\acorn.js:515:10)
    at Object.parse (...\node_modules\webpack\node_modules\acorn\dist\acorn.js:3098:39)
    at Parser.parse (...\node_modules\webpack\lib\Parser.js:902:15)
    at NormalModule.<anonymous> (...\node_modules\webpack\lib\NormalModule.js:104:16)
    at NormalModule.onModuleBuild (...\node_modules\webpack-core\lib\NormalModuleMixin.js:310:10)
    at nextLoader (...\node_modules\webpack-core\lib\NormalModuleMixin.js:275:25)
    at ...\node_modules\webpack-core\lib\NormalModuleMixin.js:259:5
    at Storage.finished (...\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:38:16)
    at ...\node_modules\graceful-fs\graceful-fs.js:78:16
    at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:511:3)

npm info lifecycle [email protected] /cdn-cgi/l/email-protection~build: Failed to exec build script
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] /cdn-cgi/l/email-protection build: `node scripts/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] /cdn-cgi/l/email-protection build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     ...\_logs\2018-03-09T15_48_06_442Z-debug.log

我进行了很多搜索并发现多种解决方案为了Unexpected character '#'问题，还他们中没有一个真正适合我。这里的问题是npm-cli.js正在捆绑并且第一行包含#!/usr/bin/env node. 如何最好地解决这一问题？

尝试过的解决方案

BannerPlugin.js (docs https://github.com/webpack/webpack.js.org/blob/master/src/content/plugins/banner-plugin.md): 抛出一个新问题描述here https://stackoverflow.com/q/49189804/6761698并且实际上并没有解决原来的问题。来源（StackOverflow） https://stackoverflow.com/a/40763389/6761698.
创建加载器：来源（GitHub） https://github.com/webpack/webpack/issues/4603.
导入shebang-loader：有不同的方法来导入这个加载程序，我已经尝试了很多，但似乎没有一个真正有效。最重要的是，最后一次更新是 2 年前，并且没有明确的文档（我从链接到此存储库的 GitHub 线程或从他们的问题中获取了大部分信息）来源（GitHub） https://github.com/JavascriptIsMagic/shebang-loader.

规格

package.json（Pastebin） https://pastebin.com/yq02Vmbp
build.js（Pastebin） https://pastebin.com/C6xGQTRA
webpack.config.dev.js (Pastebin) https://pastebin.com/J5Hd1C9J
webpack.config.prod.js（Pastebin） https://pastebin.com/fY2x16kE
网络包版本：“[email protected] /cdn-cgi/l/email-protection"

NPM log:

...\_logs\2018-03-09T15_48_06_442Z-debug.log

0 info it worked if it ends with ok
1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe',
1 verbose cli   'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli   'run',
1 verbose cli   'build' ]
2 info using [email protected] /cdn-cgi/l/email-protection
3 info using [email protected] /cdn-cgi/l/email-protection
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle [email protected] /cdn-cgi/l/email-protection~prebuild: [email protected] /cdn-cgi/l/email-protection
6 verbose lifecycle [email protected] /cdn-cgi/l/email-protection~prebuild: unsafe-perm in lifecycle true
7 verbose lifecycle [email protected] /cdn-cgi/l/email-protection~prebuild: PATH: ALLPATHSFROMPC
8 verbose lifecycle [email protected] /cdn-cgi/l/email-protection~prebuild: CWD: PROJECTPATH
9 silly lifecycle [email protected] /cdn-cgi/l/email-protection~prebuild: Args: [ '/d /s /c', 'rimraf ./build' ]
10 silly lifecycle [email protected] /cdn-cgi/l/email-protection~prebuild: Returned: code: 0  signal: null
11 info lifecycle [email protected] /cdn-cgi/l/email-protection~build: [email protected] /cdn-cgi/l/email-protection
12 verbose lifecycle [email protected] /cdn-cgi/l/email-protection~build: unsafe-perm in lifecycle true
13 verbose lifecycle [email protected] /cdn-cgi/l/email-protection~build: PATH: ALLPATHSFROMPC
14 verbose lifecycle [email protected] /cdn-cgi/l/email-protection~build: CWD: PROJECTPATH
15 silly lifecycle [email protected] /cdn-cgi/l/email-protection~build: Args: [ '/d /s /c', 'node scripts/build.js' ]
16 silly lifecycle [email protected] /cdn-cgi/l/email-protection~build: Returned: code: 1  signal: null
17 info lifecycle [email protected] /cdn-cgi/l/email-protection~build: Failed to exec build script
18 verbose stack Error: [email protected] /cdn-cgi/l/email-protection build: `node scripts/build.js`
18 verbose stack Exit status 1
18 verbose stack     at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:285:16)
18 verbose stack     at emitTwo (events.js:126:13)
18 verbose stack     at EventEmitter.emit (events.js:214:7)
18 verbose stack     at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
18 verbose stack     at emitTwo (events.js:126:13)
18 verbose stack     at ChildProcess.emit (events.js:214:7)
18 verbose stack     at maybeClose (internal/child_process.js:925:16)
18 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
19 verbose pkgid [email protected] /cdn-cgi/l/email-protection
20 verbose cwd PROJECTPATH
21 verbose Windows_NT 10.0.16299
22 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "build"
23 verbose node v8.9.4
24 verbose npm  v5.6.0
25 error code ELIFECYCLE
26 error errno 1
27 error [email protected] /cdn-cgi/l/email-protection build: `node scripts/build.js`
27 error Exit status 1
28 error Failed at the [email protected] /cdn-cgi/l/email-protection build script.
28 error This is probably not a problem with npm. There is likely additional logging output above.
29 verbose exit [ 1, true ]

Notes:

将项目名称替换为“app"
将项目路径替换为“PROJECTPATH" or "..."
将 PATH 路径替换为“ALLPATHSFROMPC"

Edits:

添加了注释部分
添加了NPM日志2018-03-09T15_48_06_442Z-debug.log section
添加了build.js文件作为 Pastebin 链接
添加了package.json文件作为 Pastebin 链接

经过排查，发现问题出在package.json上。

1) 从 package.json 中删除 npm 和 npm-run-all 模块：

"npm": "^5.7.1",
"npm-run-all": "^4.0.2",

2) 从 webpack.config.prod.js 中删除 BannerPlugin

// version 1 webpack
new webpack.BannerPlugin("#!/usr/bin/env node", { raw: false }),

// version 2 webpack
new webpack.BannerPlugin({
  banner: "#!/usr/bin/env node",
  raw: true
});

我们不再需要这些了。

3）使用稳定的npm-和node版本进行全局执行：

节点 v6.9.x
npm v4.x.x

看到这个webpack 2 示例 https://github.com/hendrathings/webpack-error-npm-cli-shebang（克隆并在本地尝试）并运行npm run coba.

问题出在 package.json 中。当 webpack 在生产模式下构建时，它会认为需要包含 npm 和 npm-run-all 模块，但事实并非如此。

您不应将 npm 作为模块包含在 package.json 中，因为它是包管理器可执行文件。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)