JavaScript：解析意外字符'#'；介绍_Javascript_Npm_Webpack

JavaScript：解析意外字符'#'；介绍

javascript npm webpack

JavaScript：解析意外字符'#'；介绍,javascript,npm,webpack,Javascript,Npm,Webpack,我的React应用程序可以在开发模式（webpack.config.dev.js）下执行npm run build，但不能在生产模式（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

我的React应用程序可以在开发模式（

webpack.config.dev.js

）下执行

npm run build

，但不能在生产模式（

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 app@0.1.0~build: Failed to exec build script
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! app@0.1.0 build: `node scripts/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the app@0.1.0 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

注意事项：

将项目名称替换为“
```
app
```
”
将项目路径替换为“
```
projectpath
```
”或“
```
…
```
”
将路径替换为“
```
ALLPATHSFROMPC
```
”

编辑：

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

经过调查，我发现问题来自package.json

1）从包中删除npm和npm运行所有模块。json:

```
“npm”：“^5.7.1”，
```
```
“npm全部运行”：“^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和节点版本进行全局执行：

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

查看此内容（克隆并在本地尝试），然后运行

npm run coba

问题出在package.json中。当网页在生产模式下构建时，它会认为npm和npm运行的所有模块都需要包含，而它们不是

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

您可以将示例项目放到github中吗？如果只使用webpack配置，则很难复制file@hendrathings我最近才被安排参与这个涉及到这个问题的项目，所以我不知道整个结构，我不能分享整个项目本身。我想指出，产生问题的shebang位于

npm cli.js

（应该可以访问）。我还不知道这是怎么被捆绑的。

build.js

文件能满足您的要求吗？npm-cli.js的用途是什么？是否将其导入react src代码？尚未在项目中找到npm-cli.js的具体用途。该项目是一个“完成的”react应用程序，我想它使用cli进行开发。我认为在最终构建中不需要它，但我不知道它在哪里或如何被捆绑。我很想提供更多关于使用的信息，但我无法提供。您能否添加此

2018-03-09T15\u 48\u 06\u 442Z-debug.log

？删除

节点模块后，按照以下步骤操作（实际上只有删除npm和npm才能运行package.json中的所有包，因为BannerPlugin已经被删除，我的npm和节点也是全局的）执行npm i
，命令npm run build
实际上运行时没有错误，项目是第一次构建的。包括示例在内的时间投资一定非常大，我非常感谢您！我使用Mqtt.js
作为我的客户机，它本身就有shebang
，我使用shebang loader在我的webpack
配置文件中解决它，在我的react
组件中，我使用它作为import{connect}从'mqtt'
导入{connect}，在windows中一切都很好，但是我在Ubuntu
中提取代码，然后模块解析失败：意外字符“#”（1:0）
错误再次出现，似乎我的网页没有看到shebang加载程序存在。
// 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
});