Webpack具有反应热负载和导轨

时间:2016-06-22 20:30:31

标签: ruby-on-rails webpack-dev-server react-hot-loader

我在Rails应用程序中使用React和webpack的react-hot-loader插件进行了Webpack设置。它正在成功地工作并构建我期望的bundle.js文件,但它也在每个热更新0.bfeb31eda5c7e8da9473.hot-update.js上给我这样的文件。我使用的其中一个插件的作者WriteFileWebpackPlugin说我可以在test属性中告诉它不要查看其中包含.hot的文件,但我可以& #39;弄清楚如何让它发挥作用。

这是我的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属性可以解决这个问题,但即使只是想出来也会有所帮助。

1 个答案:

答案 0 :(得分: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')
      }
    ]
  },