Angular-cli aot 构建在生产模式下失败

Posted 2023-02-23

【中文标题】Angular-cli aot 构建在生产模式下失败

【英文标题】：Angular-cli aot build fails in production mode

【发布时间】：2017-10-22 14:05:51

【问题描述】：

子编译失败：模块构建失败：TypeError： 无法读取未定义的属性“newLine” 在 Object.getNewLineCharacter (C:...\node_modules\typescript\lib\typescript.js:9581:20) 在 Object.createCompilerHost (C:...\node_modules\typescript\lib\typescript.js:66675:26) 在 Object.ngcLoader (C:...\node_modules\@ngtools\webpack\src\loader.js:386:33): TypeError: Cannot read property 'newLine' of undefined

./src/main.ts 中的错误未找到模块：错误：无法解析 './$$_gendir/app/app.module.ngfactory' 在 'C:...\src' @ ./src/main.ts 2:0-74 @多./src/main.ts

npm 错误！ Windows_NT 10.0.15063 npm 错误！ argv "C:\程序 文件\nodejs\node.exe" "C:\Program 文件\nodejs\node_modules\npm\bin\npm-cli.js" "运行" "ng" "构建" “--” “--prod” npm 错误！节点 v6.10.3 npm 错误！ npm v3.10.10 npm 错误！ 代码 ELIFECYCLE npm 错误！ fol-mcdean@0.1.0 ng：ng "build" "--prod" npm 错误！退出状态 1 npm ERR！ npm 错误！失败了 fol-mcdean@0.1.0 ng 脚本 'ng "build" "--prod"'。 npm 错误！确保 你已经安装了最新版本的 node.js 和 npm。 npm 错误！如果 你这样做，这很可能是 fol-mcdean 包 npm 的问题 呃！不是 npm 本身。 npm 错误！告诉作者这失败了 你的系统：npm ERR！ ng "build" "--prod" npm 错误！你可以得到 有关如何打开此项目的问题的信息：npm ERR！ npm 错误 fol-mcdean npm ERR！或者，如果这不可用，你可以得到 他们的信息来自：npm ERR！ npm 所有者 ls fol-mcdean npm ERR！有 上面可能有额外的日志输出。

npm 错误！请在任何支持请求中包含以下文件： npm 错误！ C:...\npm-debug.log

我有一个项目，使用@angular 4.1.3 和@angular/cli 1.1.0-rc.0（也尝试了1.04，结果相同）。所以项目构建良好 ng 构建 --aot=true 但使用 ng build --prod 失败并出现此错误。

我对 \node_modules@ngtools\webpack\src\loader.js 做了一些调试

事实证明它在以下几行中断：

function ngcLoader()  
...
const sourceFileName = this.resourcePath; //here is index.ts file, I'll show it later
const plugin = this._compilation._ngToolsWebpackPluginInstance; //plugin === undefined here!
if (plugin && plugin instanceof plugin_1.AotPlugin)  //and of course this is false
...
 else 
const options = loaderUtils.getOptions(this) || ; //and options are  here...
...
const compilerHost = ts.createCompilerHost(compilerOptions); //and of cource it breaks here
...

它失败的文件是index.ts：

export * from './GJLog.component';

我还检查了所有软件包的所有版本，清理了缓存，重新安装了节点.. 一切.. 但在 AOT 模式下仍然存在同样的问题。同时用aot=false完美编译...

然后我决定阅读--prod 和非--prod 之间的区别： 并运行以下命令：

npm run ng build -- --aot=true --environment=prod --output-hashing=all --sourcemaps=false --extract-css=true

成功了！

那么，剩下的就是：

--prod 还设置了以下不可标记的设置：

1) 如果在 .angular-cli.json 中配置，则添加服务工作者。

2) 将模块中的 process.env.NODE_ENV 替换为生产值（这对于某些库来说是必需的，例如 react）。

3) 在代码上运行 UglifyJS

所以我没有任何服务人员，并且 process.env.NODE_ENV 也不适用...... 那么这是 UglifyJS 吗？ 不知道下一步该怎么做。有什么建议吗？

【问题讨论】：

见这里：github.com/angular/angular-cli/issues/3985

不。它不起作用。我已经尝试了所有重新安装/清理/重置 npm 缓存的方法。事实并非如此......

那我建议在github.com/angular/angular-cli打开一个问题

会做...希望他们会回答一些问题:)

【参考方案1】：

我对该问题的解决方案和调查如下： https://github.com/angular/angular-cli/issues/6426

一般来说，原因似乎在于 cssnano 和一个空的 url("")。