[英]not found the scss file when using styling in angular
我想使用 angular 中的样式作为 scss 文件中的短地址。
我通过这种方式使用样式:
我在src
文件夹中创建一个文件夹并将样式放在上面:
和我 go 到angular-cli.json
我添加这个:
"stylePreprocessorOptions": {
"includePaths": [
"src",
"src/stylings/",
"src/stylings/base/",
"src/stylings/kt-customs/"
]
},
我需要像这样在style.css
中使用它:
@import "custom-form";
@import "custom-buttons";
@import "custom-table";
@import "custom-filter";
@import "kt-customise";
但它告诉我这个错误:
> 错误在./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js.?/node_modules/postcss-loader/ src?.embedded.?/node_modules/sass-loader/dist/cjs?js.?ref--13-3?./node_modules/postcss-loader/src.?postcss?./node_modules/sass-loader/dist/ cjs.js..ref--17-1::/src/styles.scss) 模块构建失败(来自;/node_modules/sass-loader/dist/cjs:js)。 SassError:找不到要导入的样式表。 ╷ 9 │ @import "自定义表单"; │ ^^^^^^^^^^^^^ ╵ E:\MyProject\Ava\PFA\demo\src\styles.scss 9:9 根样式表
我怎么解决这个问题????
我认为您在style.scss
中使用的导入路径是错误的。 它应该是:
@import "./stylings/custom-form";
@import "./stylings/custom-buttons";
@import "./stylings/custom-table";
@import "./stylings/custom-filter";
@import "./stylings/kt-customise";
您可能需要考虑将您的scss
文件更改为 scss 部分文件。 也就是说,使用前导下划线重命名scss
文件和导入。 例如_custom-form.scss
。
单独的scss
文件被转换成单独的css
文件。 css 文件中的每个@import
都会创建一个 HTTP 请求。 这意味着更多的 css 文件 = 更多的 HTTP 请求。 导入部分将导致更少的css
文件,因此,更少的 HTTP 请求。 您可以在此处阅读有关部分的更多信息: SASS Partials 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.