javascript - Angular 构建找不到已安装的 Font-Awesome node_module

Question

每当我使用 ng build --prod 构建项目时，我都会收到以下错误:

ERROR in ./src/styles.scss
Module build failed: 
  ModuleBuildError: Module build failed: 
    Error: Can't resolve '~font-awesome/css/font-awesome.css' in '/app/src'

styles.css 使用@import "~font-awesome/css/font-awesome.css";。我已验证路径并且该模块已正确安装在 node_modules/font-awesome 处。

我还尝试导入带或不带文件结尾的 scss 版本。当我删除 @import 语句时，一切正常，即使我在同一文件中使用其他对其他 node_modules 的导入 - 所以这似乎只是 font-awesome 包的问题......

此外，我还通过 SSH 连接到我的 docker 容器来检查 node_modules/font-awesome/css/font-awesome.css 是否存在，而且确实存在。

想法？

Answer 1

我不确定为什么该文件的 CSS 版本从来没有工作过，但我能够找到 docs on the angular-cli这给了我一些如何让它发挥作用的提示。

1) 导入SCSS版本而不是CSS版本。

@import "~font-awesome/scss/font-awesome.scss";

2) 将字体路径定义为 SCSS 变量。

$fa-font-path: "~font-awesome/fonts";

请注意，SCSS 变量必须在 @import 语句之前定义。

奇怪的是，事情错误随机发生。对于一个开发人员来说，一切都工作正常，但是当将存储库拉到第二台计算机时，就出现了这个问题。