带有 react-hot-loading 和 rails 的 Webpack

Question

我在我们的 Rails 应用程序中使用 React 和 webpack 的 react-hot-loader 插件设置了 Webpack。它正在成功运行并构建我期待的bundle.js 文件，但它也在每次热更新0.bfeb31eda5c7e8da9473.hot-update.js 时为我提供这样的文件。我正在使用的插件之一的作者WriteFileWebpackPlugin 说我可以在test 属性中告诉它不要监视其中包含.hot 的文件，但我不知道如何获得它上班。

这是我的 webpack.config.js

var webpack = require('webpack')
var path = require('path')
var WriteFilePlugin = require('write-file-webpack-plugin')

module.exports = {
  // watchOptions: {
  //   poll: true
  // },
  context: __dirname + '/app/assets/javascripts',
  entry: {
    App: [
      'webpack-dev-server/client?http://localhost:8080/',
      'webpack/hot/only-dev-server',
      path.resolve(__dirname, 'app/assets/source/index.js')
    ]
  },
  output: {
    path: path.resolve(__dirname, 'app/assets/javascripts'),
    publicPath: 'http://localhost:8080/',
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      { test: /\.js$/,
        loaders: ["react-hot", "babel"],
        include: path.resolve(__dirname, 'app/assets/source')
      }
    ]
  },
  devtool: 'inline-source-map',
  devServer: {
    outputPath: path.resolve(__dirname, 'app/assets/javascripts')
  },
  plugins: [
    new WriteFilePlugin({test: /^.*[^\.].*\.js$/}),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
  ]
}

还有其他人遇到过这种情况吗？如果可能的话，我想弄清楚如果没有test 属性是否可以解决这个问题，但即使只是弄清楚这一点也会有所帮助。

Answer 1

好的，我没有使用过那个插件，但是你说你需要更新以下内容：

旧

  module: {
    loaders: [
      { test: /\.js$/,
        loaders: ["react-hot", "babel"],
        include: path.resolve(__dirname, 'app/assets/source')
      }
    ]
  },

新

module: {
    loaders: [
      { test: /^((?!(.hot-update)).)*\.js$/,
        loaders: ["react-hot", "babel"],
        include: path.resolve(__dirname, 'app/assets/source')
      }
    ]
  },