1

何ヶ月も使用webpack-dev-middlewarewebpack-hot-middlewareていて、問題なく動作していましたが、今、何かが起こり、webpack がファイルの変更の監視を停止したため、アプリを再起動したときにのみバンドルが再構築されます。何が起こる可能性がありますか?私は、fs.inotify.max_user_watches = 524288設定をオンにして:set backupcopy=yesvimオプションも調整したarch Linuxを使用しています。何が起こる可能性がありますか?物事を取り戻す方法は?

ログに表示されるように、最初のバンドルが行われ、ミドルウェアが適切にロードされます。以下は、エントリー アプリに 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

Lol にconsole.webpack渡された関数のばかげたタイプミスで、機能webpack-hot-middleware logしませんでした。webpack によって提供される巨大なログ出力の一番上までスクロールするとエラーが表示され、このタイプミスが非常に目立たなくなりました。

于 2016-06-14T12:06:53.350 に答える