1

我用webpack-dev-middleware了webpack-hot-middleware几个月，它工作得很好，但是现在，发生了一些事情，webpack 停止监视文件更改，所以只有在我重新启动应用程序时才会重新构建包。会发生什么？我在 Arch linux 上，fs.inotify.max_user_watches = 524288设置和:set backupcopy=yesvim 选项也已调整。会发生什么？怎么把东西找回来？

最初的捆绑发生，中间件正确加载，正如我在日志中看到的那样。这是在入口应用程序中加载 webpack 中间件的行。

(function() {
  if (process.env.NODE_ENV === 'development') {
    console.server('Running webpack middleware...');
    var webpack = require('webpack');
    var webpackConfig = require('../config/webpack.config.js');
    var compiler = webpack(webpackConfig);

    app.use(require("webpack-dev-middleware")(compiler, {
      hot: true,
      noInfo: false,
      stats: {
        colors: true
      },
      historyApiFallback: true,
      publicPath: '',
      contentBase: './app'
    }));

    app.use(require("webpack-hot-middleware")(compiler, {
      log: console.webpack,
      heartbeat: 10 * 1000
    }));
  }
})();

和webpack.config.js

const webpack = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const autoprefixer = require('autoprefixer');

const PATHS = {
  app: {
    client: path.resolve(__dirname, '../app'),
    admin: path.resolve(__dirname, '../admin-app')
  },
  styles: path.resolve(__dirname, '../public/stylesheets'),
  build: path.resolve(__dirname, '../public/build'),
  public: path.resolve(__dirname, '../public')
};

const plugins = [
  // Shared code
  new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.bundle.js'),
  // Avoid publishing files when compilation fails
  new webpack.HotModuleReplacementPlugin(),
  new webpack.NoErrorsPlugin(),
  new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify('development'),
    __DEV__: JSON.stringify(JSON.parse(process.env.DEBUG || 'false'))
  }),
  new webpack.optimize.OccurenceOrderPlugin(),
  new ExtractTextPlugin('stylesheet.css')
];

const config = {
  env: process.env.NODE_ENV,
  entry: {
    client: [path.resolve(PATHS.app.client + '/index.js'), 'webpack-hot-middleware/client?path=http://localhost:3000/__webpack_hmr'],
    admin: [path.resolve(PATHS.app.admin + '/index.js'), 'webpack-hot-middleware/client?path=http://localhost:3000/__webpack_hmr']
  },
  output: {
    path: PATHS.build,
    filename: '[name].bundle.js',
    publicPath: '/'
  },
  stats: {
    colors: true,
    reasons: true
  },
  resolve: {
    modulesDirectories: ['node_modules'],
    alias: {},
    extensions: ['', '.jsx', '.js']
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        include: PATHS.app.client,
        loaders: ['react-hot', 'babel']
      },
      {
        test: /\.jsx?$/,
        include: PATHS.app.admin,
        loaders: ['react-hot', 'babel']
      },
      {
        test: /\.scss$/,
        loader: ExtractTextPlugin.extract('style-loader', ['css-loader', 'postcss-loader', 'sass-loader'])
      }
    ]
  },
  plugins: plugins,
  devtool: 'eval'
};

module.exports = config;
4

1 回答 1

1

console.webpack大声笑只是传递给的函数中的一个愚蠢的错字webpack-hot-middleware log并没有让它工作。当滚动到 webpack 提供的巨大日志输出的最顶部时看到错误，这使得这个错字非常隐蔽。

于 2016-06-14T12:06:53.350 回答