Visual Studio 2017 - Angular - Webpack - SASS - 样式未应用

Question

我从visual studio创建了一个新的角度应用程序。它没有支持sass。

我安装了node-sass，raw-loader和sas-loader并将该行添加到webpack.config.js中： { test: /\.scss$/, loaders: ["raw-loader", "sass-loader"] }

我把它添加到我的家庭组件中： styleUrls: ['./home.component.scss']

home.component.scss文件仅包含以下内容：

.body {
    background-color: red
}

该网站运行没有错误，但背景为白色。另外，我没有看到和相应的css文件（应该在哪里？）。

Answer 1

在空的visual studio模板中，'。body'与home组件中的任何元素都不匹配。

测试，尝试'home.component.scss'：

$primary-color: red;
h1 {
    color: $primary-color;
}

没有相应的css文件，已编译的css被写入html中的样式标记：

<style>
h1[_ngcontent-c2] {
  color: red; }
</style>