Предварительный загрузчик scsslint-hot в Webpack не работает в подкаталогах

Question

Я использую scss-lint для линтинга моих файлов SCSS. Для запуска в горячем режиме в Webpack я использую scsslint-hot.

Я добавил его в мои preLoaders в Webpack, и он отлично работает, пока файлы не вложены в подкаталоги.

Например:

./src/style/layout.scss написано правильно.

НО

./src/style/mixins/buttons.scss НЕ получает никаких ограничений. Зачем?

Что я делаю неправильно? Я много гуглил, и в документации Webpack сказано, что include также должен включать подкаталоги.

Мой .scss-lint.yml содержит только правила, я уже пытался добавить scss_files: 'src/style/**/*.scss' к файлу yml, но это не решает проблему.

Это интересная часть моего webpack.config.js:

var dir_style = path.resolve(__dirname, 'src', 'style’);

…

preLoaders: [
    {
        ...
    },
    {
        test: /\.scss$/,
        loader: 'scsslint-hot',
        include: dir_style,
        query: {
            config: '.scss-lint.yml',
            failOnError: production,
            failOnWarning: production,
        }
    }
],

И, возможно, вам нужно увидеть мой полный конфиг вебпак, вот и вы:

var webpack = require('webpack'),
    path = require('path'),
    HtmlWebpackPlugin = require('html-webpack-plugin'),
    autoprefixer = require('autoprefixer'),
    cssnano = require('cssnano'),
    WebpackCleanupPlugin = require('webpack-cleanup-plugin');
    webpackFailPlugin = require('webpack-fail-plugin');

var production = process.env.NODE_ENV === 'production',
    dir_src = path.resolve(__dirname, 'src'),
    dir_js = path.resolve(dir_src, 'js'),
    dir_style = path.resolve(dir_src, 'style'),
    dir_assets = path.resolve(dir_src, 'assets'),
    dir_public = path.resolve(__dirname, 'public'),
    dir_exclude = /(node_modules|public)/;

const HOST = process.env.HOST || "127.0.0.1";
const PORT = process.env.PORT || "8888";


var plugins = [
    webpackFailPlugin,
    new webpack.HotModuleReplacementPlugin(),
    new HtmlWebpackPlugin({
        template: './src/template.html'
    })
];

if (production) {
    plugins.push(
        new webpack.NoErrorsPlugin(), // needs to be only set for production otherwise failOnErrors will be ignored

        // process.env.NODE_ENV is already set to production through "build" task in
        // package.json, but defining it again reduces file size enormous, but I don't know why
        new webpack.DefinePlugin({
            'process.env': {
                'NODE_ENV': JSON.stringify('production')
            }
        }),
        new WebpackCleanupPlugin(),
        new webpack.optimize.OccurenceOrderPlugin(),
        new webpack.optimize.DedupePlugin(),
        new webpack.optimize.UglifyJsPlugin({
            sourceMap: false,
            mangle: true,
            compress: {
                warnings: false
            },
            output: {
                comments: false
            }
        }),
        new webpack.optimize.MinChunkSizePlugin({minChunkSize: 10000})
    );
}

module.exports = {
 entry: {
        index: path.resolve(dir_js, 'index.jsx')
    },
 output: {
  path: dir_public,
  filename: '[name]_[hash].min.js'
 },
 resolve: {
  extensions: ['', '.js', '.jsx']
 },
 module: {
        preLoaders: [
            {
                test: /\.jsx?$/,
                loader: 'eslint',
                include: dir_js
            },
            {
                test: /\.scss$/,
                loader: 'scsslint-hot',
                include: dir_style,
                query: {
                    config: '.scss-lint.yml',
                    failOnError: production,
                    failOnWarning: production,
                }
            }
        ],
  loaders: [
            {
                test: /\.jsx?$/,
                exclude: dir_exclude,
                loader: 'babel',
                query: {
                    presets: ['es2015', 'react'],
                    plugins: [
                        'transform-runtime',
                        'transform-decorators-legacy',
                        'transform-class-properties',
                        'react-hot-loader/babel'
                    ],
                    cacheDirectory: true
                }
            },
            {
                test: /\.scss$/,
                include: dir_style,
                loaders: ['style', production ? 'css' :'css?sourceMap', 'postcss', 'sass']
            },
            {
                test: /\.(png|jpe?g|gif|mp3|svg)$/,
                include: dir_assets,
                exclude: dir_exclude,
                loader: 'url-loader?limit=10000'
            }
        ]
 },
 devServer: {
  contentBase: "./public",
  // do not print bundle build stats
  noInfo: true,
  // enable HMR
  hot: true,
  // embed the webpack-dev-server runtime into the bundle
  inline: true,
  // serve index.html in place of 404 responses to allow HTML5 history
  historyApiFallback: true,
  port: PORT,
  host: HOST
 },
 plugins: plugins,
    eslint: {
        failOnWarning: production,
        failOnError: production
    },
    postcss: function () {
        return [autoprefixer({ browsers: ['last 2 versions'] }), cssnano];
    },
    debug: !production,
    devtool: production ? false : 'cheap-module-eval-source-map'
};

Спасибо за вашу помощь!

Schecke

Answer 1

Хорошо, 2 дня спустя, ничего не меняя, это внезапно работает:-)

Так что, похоже, это проблема кеширования.