Angular 2中的Sass和Web包不工作

我根据sass装载机包行事： 在我的网络配置中，我有：

{
        loaders: [
            {
                test: /\.scss$/,
                loaders: ["style", "css", "sass"]
            }
        ]
    }

在模块中，我按如下方式导入SCS：

 styles:  require('./home.scss') ,

$font-stack:    Helvetica, sans-serif;
$primary-color: #333;

md-card {
font: 100% $font-stack;
color: $primary-color;
}

Scss文件如下所示：

 styles:  require('./home.scss') ,

$font-stack:    Helvetica, sans-serif;
$primary-color: #333;

md-card {
font: 100% $font-stack;
color: $primary-color;
}

不幸的是，当我运行应用程序时，会发生以下情况：

ERROR in ./src/app/home/home.scss
Module parse failed: C:\src\app\home\home.scss Line 1: Unexpected token :
You may need an appropriate loader to handle this file type.
| $font-stack:    Helvetica, sans-serif;
| $primary-color: #333;
|
@ ./src/app/home/home.component.ts 49:20-42

---

我认为一切都应该正常，当它失败时？

我建议原始加载程序将样式导入angular2组件：

而且

样式

应该是一个数组

...
styles: [ require('./home.scss') ],
...

另见：

---

顺便说一句：您也可以使用原始加载程序来导入模板。

不知道这是否是问题所在，但是定义对象中的

style

应该是一个数组：

style:[require（'./home.scss'）]，

是的，我也尝试过该语法，它也不起作用。此解决方案仅适用于开发人员，请尝试使用构建仅限['raw-loader'、'sass-loader']，我无法在组件中找到避免要求的解决方案。@UlandNimblehoof try:，它是tsc的完全替代品，支持自动导入模板/样式和aot编译