每当我使用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包的问题......
另外,我在我的docker容器中使用SSH来检查node_modules/font-awesome/css/font-awesome.css
是否存在,并确实存在。
想法?
答案 0 :(得分:0)
对我有用(这行在我的主app.css中)
@import "node_modules/font-awesome/scss/font-awesome";
答案 1 :(得分:0)
您需要在.angular-cli.json
文件中添加styles
下的apps
,如下所示:
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"name": "MyProject",
"ejected": false
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"manifest.json",
{
"glob": "**/*",
"input": "../node_modules/leaflet/dist/images",
"output": "./assets/",
"allowOutsideOutDir": false
}
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"serviceWorker": true,
"styles": [
"assets/sass/global/loading.css",
"../node_modules/font-awesome/css/font-awesome.min.css", <===================
"styles.scss"
],
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"demo": "environments/environment.demo.ts",
"prod": "environments/environment.prod.ts",
"qa": "environments/environment.qa.ts",
"e2e": "environments/environment.e2e.ts"
}
}
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"project": "src/tsconfig.app.json",
"exclude": "**/node_modules/**"
},
{
"project": "src/tsconfig.spec.json"
},
{
"project": "e2e/tsconfig.e2e.json"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "scss",
"component": {
}
}
}
答案 2 :(得分:0)
我不确定为什么该文件的CSS版本从未起作用,但我能够找到docs on the angular-cli,它给了我一些如何让它工作的提示。
1)导入SCSS版本而不是CSS版本。
cellForRow
2)将字体路径定义为SCSS变量。
cell.collectionData = data
请注意,必须在@import "~font-awesome/scss/font-awesome.scss";
语句之前定义SCSS var。
奇怪的是,事情错误随机发生了。对于一个开发人员来说,一切都运行良好,但是当将回购再次引入第二台计算机时,就会引入这个问题。