2
webpackを使用して1つの.CSSファイルに.SASSを構築していますが、端末で "webpack"を実行したときにのみファイルをエクスポートします。私は「WebPACKの-DEV-server」を実行すると、それは変化を見ているが、出力.CSSファイル変更/生成しません：それはちょうど「のWebPACK」と完全に正常に動作しますが、私はそれを作る方法を疑問に思うWebpack dev server - .CSSファイルのエクスポート時の変更
var webpack = require('webpack');
var path = require('path');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const autoprefixer = require('autoprefixer');
module.exports = {
devtool: 'inline-source-map',
entry: [
'webpack-dev-server/client?http://127.0.0.1:8080/',
'webpack/hot/only-dev-server',
'./src'
],
output: {
path: path.join(__dirname, 'public'),
filename: 'bundle.js', // this exports the final .js file
publicPath: '/public'
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
loaders: ['react-hot', 'babel?presets[]=react,presets[]=es2015']
},
{
test: /\.scss$/, loader: ExtractTextPlugin.extract('css!sass') // this loads SASS
}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new ExtractTextPlugin("./bundle.css") //this exports the CSS file
],
resolve: {
modulesDirectories: ['node_modules', 'src'],
extensions: ['', '.js', '.scss'],
root: [path.join(__dirname, './src')]
}
};
をサーバーを使用してファイルを生成するので、スタイルを変更するたびに端末に入力する必要はありません。
'WebPACKの-DEV-server'がないファイルシステムから、ファイルを生成し、メモリから提供：ターミナルショーを理由です。 –
ExtractTextPluginに 'style-loader'を追加する必要があります：' ExtractTextPlugin.extract（ 'style'、 'css！sass'） ' –
ええと、ファイルをレンダリングしますが、ディレクトリに入れません。端末のスクリーンショットは次のとおりです：http://i.imgur.com/OJGrpKY.png –