私はAngular2 Universalスタータを使用してプロジェクトをセットアップしています。私はセットアップにSCSSファイルをしようとしているが、抽出テキストプラグインを使用したとき、私は問題に実行しています:Angular2/Webpack 2/Sassセットアップ:TypeError:cssText.replaceは関数ではありません
package.json
"webpack": "2.2.1",
"extract-text-webpack-plugin": "^2.0.0-rc.2"
WebPACKのセットアップ:
....
module: {
rules: [
// TypeScript
{ test: /\.ts$/, use: ['awesome-typescript-loader', 'angular2-template-loader'] },
{ test: /\.html$/, use: 'raw-loader' },
{ test: /\.css$/, use: 'raw-loader' },
{ test: /\.scss$/, use: ExtractTextPlugin.extract({fallbackLoader: "style-loader", loader:'raw-loader!sass-loader'})},
{ test: /\.(woff2?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/, use: "file?name=fonts/[name].[ext]"},
{ test: /\.json$/, use: 'json-loader' }
],
},
plugins: [
//Use commonPlugins.
new ExtractTextPlugin({
filename: '[name].css',
allChunks: true,
disable: false
})
]....
を私が構築するときこのプロジェクトは、私はこのエラーを取得:私のアプリCompoNetをで
TypeError: cssText.replace is not a function
を、私は「angular2テンプレート-LOAを使ってSCSSファイルを読み込みますDER」:私のdistフォルダで
...
@Component({
changeDetection: ChangeDetectionStrategy.Default,
encapsulation: ViewEncapsulation.Emulated,
selector: 'app',
styles: [require('../assets/styles/main.scss')],
は、main.scssがあるmain.cssにコンパイルされています。誰もが正しい方向に私を指すことができる場合
/**
* SCSS entry point
* IMPORTANT: Do not add any styles here instead import your scss files
*/
/*!
* Bootstrap v3.3.7 (http://getbootstrap.com)
* Copyright 2011-2016 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%; }
body {
margin: 0; }
article,
aside ...
、それをいただければ幸いです。ありがとうございました。
************ UPDATE *********************
は私が
require('../assets/styles/main.scss')
ことが判明しました
は、Extract Text Pluginを使用して期待どおりに文字列を返しません。
require('../assets/styles/main.scss').toString()
期待通りに動作しますが、私はヘッダーを検査したときに、私は見ている:
<link rel="stylesheet" href="/main.css"> ---> My generate scss file
<style>[object Object]</style> ---> seems like this is coming from the app component styles property???