2

我有这个 webpack 配置，我用它来处理和 lint 我的 js 和 scss。

    var path = require('path');
    var webpack = require('webpack');
    var CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin');
    var ExtractTextPlugin = require('extract-text-webpack-plugin');
    var StyleLintPlugin = require('stylelint-webpack-plugin');
    var PostCssLoader = require('postcss-loader');

    var sassLoaders = [
    'css-loader',
    'postcss-loader',
    'sass-loader'
    ]

    module.exports = {
    devtool: 'cheap-source-map',
    entry: {
        global: "./src"
    },
    output: {
        path: path.join(__dirname, "dist"),
        filename: "[name].bundle.js",
        chunkFilename: "[id].chunk.js"
    },
    module: {
        rules: [
        {
            test: /\.js/,
            loaders: ['babel-loader', 'eslint-loader'],
            exclude: /node_modules/
        },
        {
            test: /\.scss/,
            loader: ExtractTextPlugin.extract({fallback: 'style-loader', use: sassLoaders.join('!')})
        }
        ]
    },
    plugins: [
        new ExtractTextPlugin("[name].css"),
        new CommonsChunkPlugin({
        filename: "common.js",
        name: "global"
        }),
        new StyleLintPlugin({
        context: "src",
        configFile: '.stylelintrc',
        files: '**/*.scss',
        failOnError: false,
        quiet: false,
        syntax: 'scss'
        }),
        new webpack.LoaderOptionsPlugin({
            options: {
                postcss: []
            }
        })
    ],
    resolve: {
        modules: [ path.join(__dirname, './src') ],
        extensions: ['.js', '.scss', '.css']
    }
    }

在我的 src 文件夹中，我有一个 index.js 和一个 styles.scss。

正确运行webpack会检查我的 index.js 和 styles.scss 文件。但是，webpack --watch当我更改我的 js 文件时，只运行重新 lints。它似乎没有在关注我的 styles.scss 文件以获取更新。

我需要做些什么才能使 webpack watch 也能与 scss 文件一起正常工作吗？

4

0 回答 0