使用〜(波浪号)的SCSS文件导入在Angular 6中不起作用 [英] SCSS file imports using ~ (tilde) is not working in Angular 6

问题描述

关于在Angular6中导入scss文件，我有两个问题

I have two question regarding scss file imports in Angular6

1. 在全局src/sass/styles.scss中将其部分导入一次后，是否需要将我的局部文件导入所有我的component.scss文件中.不应该一次导入它吗?
2. 如何使用导入快捷方式〜导入SCSS局部变量?我所有的零件都包含在src/sass文件夹中.

1. Do I need to import my partials in all of my component.scss files after having imported it once in global src/sass/styles.scss. Shouldn't importing it once be enough?
2. How do I import SCSS partials using import shortcut ~ ? All my partials are contained in src/sass folder.

这很好:@import '../sass/variables';//in app.component.scss

但这会引发错误:@import '~sass/variables':

./src/app/app.component.scss中的

错误 模块构建失败: @import'〜sass/变量'; ^ 找不到或不可读的导入文件:〜sass/variables. 在C:\ Users \ sandeepkumar.g \ Desktop \ nodebook \ tdlr-this \ src \ app \ app.component.scss中 (第2行，第1列)

ERROR in ./src/app/app.component.scss Module build failed: @import '~sass/variables'; ^ File to import not found or unreadable: ~sass/variables. in C:\Users\sandeepkumar.g\Desktop\nodebook\tdlr-this\src\app\app.component.scss (line 2, column 1)

`

angular.json:

angular.json:

"styles": [
              ...
              "src/sass/styles.scss"
            ],

我的文件夹结构:

推荐答案

回答我自己的问题. 事实证明，这两个问题都是Angular 6中的错误".

Answering my own question. It turns out both of these problems are "bug" in Angular 6.

1. 是的，如果要在任何component.scss中使用任何.scss文件代码，则必须将其导入到该component.scss中. 问题.
2. 〜(Tilda)自Angular6起已停止工作. 问题. 改用~src导入scss.

1. Yes, if you want to use any .scss file code in any component.scss, they have to be imported in that component.scss. Issue.
2. ~ (Tilda) has stopped working since Angular6. Issue. Use ~src instead to import scss.

这篇关于使用〜(波浪号)的SCSS文件导入在Angular 6中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！