意外的“/”。使用 \ 转义特殊字符可能会有所帮助 - Angular 12 build/deploy

Question

我最近将我的代码库从 Angular 11 更新到 12，之后，我就无法部署我的代码。我可以运行 ng build 和 ng serve 并且它完美地工作，但是，当我运行 ng build --prod 我不断收到以下错误，可能是因为优化（缩小) 为产品版本制作：

文件 D:\Code\Airbox\frontend\styles.670357240e7c04682d1d.css:9031:1 不存在，它显然是由部署脚本创建的，但我看不到或无法访问它。我已尝试从我的全局 css 文件中删除评论和导入，但问题一直在发生。

我在互联网上找不到任何解决方案，我不知道发生了什么，也不知道如何找到解决方法。

Answer 1

找到了关于阅读的工作 Angular workspace documentaion。基本上，当设置--prod、angular.json时，默认情况下表示优化所有文件。为了不失去所有优化优势，我没有设置 "optimization": false，而是只将我的样式优化设置为 false，因此它不会尝试缩小我的 CSS 文件（这是导致错误的原因），而且， "inlineCritical": false 也很重要，因为如果为“真”，它会检查 CSS 文件中的每一个错误，它告诉我我的代码中某处缺少一个括号 }（这是巨大的，而且不容易我可以知道它在哪里，但很难调试）。

PS：显然这个 inlineCritical 特征在 Angular 12 上更准确，因为它在 Angular 11 之前从未发生在我身上，而且我还发现很多其他人有这个人也有同样的问题（inlineCritical）。所以这是我在 angular.json -> 配置 -> 生产 -> 优化中的新优化配置：

"optimization": {
   "scripts": true,
   "styles": {
      "minify": false,
      "inlineCritical": false
   },
   "fonts": true
 },

希望对大家有所帮助。如果有人找到此问题的 why 答案，请告诉我们，我真的很好奇这里发生了什么。

意外的“/”。使用 \ 转义特殊字符可能会有所帮助 - Angular 12 build/deploy

Unexpected '/'. Escaping special characters with \ may help - Angular 12 build/deploy

postcss

angular