サス角度2中とWebPACKの

Question

を働いていない私は、SASS-ローダパッケージに応じて演技しています：私は私のWebConfigで ：

モジュールで

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

私はこのようなSCSSをインポートします。

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

SCSSファイルは次のようになります。

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

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

を残念ながら、私はアプリを実行すると、以下のことが起こりますs：

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 

私はすべてが大丈夫だと思ったら、それは失敗するでしょうか？

Answer 1

私はangular2コンポーネントにスタイルをインポートする生・ローダーをお勧めします：https://github.com/webpack/raw-loader

... 
loaders: [ 
    { 
     test: /\.scss$/, 
     loaders: ['raw-loader', 'sass-loader'] 
    } 
] 
... 

またstylesは配列でなければなりません！

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

も参照してください：ところでhttps://github.com/AngularClass/angular2-webpack-starter/wiki/How-to-include-SCSS-in-components

：あなたも、テンプレートをインポートするための生ローダーを使用することができます。