webpack dev сервер игнорирует изменения scss

Question

Мне удалось сжать/скомпилировать файлы js и scss с помощью webpack. Файл scss извлекается при помощи 'extract-text-webpack-plugin' во внешний файл css. Вот код:

var path = require('path'); 
var webpack = require('webpack'); 
var ExtractTextPlugin = require("extract-text-webpack-plugin"); 
require('es6-promise').polyfill(); 

module.exports = { 
    entry: ['./js/app'], 
    output: { 
    path: path.join(__dirname, 'js'), 
    publicPath: 'js', 
    filename: 'app.min.js' 
    }, 
plugins: [ 
    new webpack.optimize.UglifyJsPlugin({ 
    compressor: { 
    warnings: false, 
    }, 
    }), 
    new webpack.optimize.OccurrenceOrderPlugin(), 
    new ExtractTextPlugin("../css/styles.min.css", {allChunks: false}) 
], 
module: { 
    loaders: [{ 
    test: /\.scss$/, 
    loader: ExtractTextPlugin.extract("style-loader", "css-loader!sass-loader") 
    }] 
} 
} 

Когда я запускаю сейчас «WebPack-DEV-сервер JS/app.js» - он получает мои изменения в JS сам файл (предупреждение, например), но не заметить изменения в файле css.

Это является app.js:

var $ = require('jquery'); 
require('../css/styles.scss'); 

alert('Hi'); 

Я предполагаю, что проблема связана с ExtractTextPlugin. И снова я понятия не имею, как обходиться. Любые советы или идеи?

Answer 1

Хорошо, я получил это. При запуске WebPack-DEV-сервер, я просто спрашиваю, если мы находимся в производственной среде:

const live = process.env.NODE_ENV === "production"; 

if(live) { 
... 
} else { 
... 
} 

Если мы не в производстве, он не попадает в ExtractTextPlugin из.

Наконец, чтобы развернуть свои изменения я типа:

NODE_ENV=production webpack -p 

Можно также использовать НПМ скрипт, чтобы сократить это.