Question

我遇到的问题是我的代码没有重新加载HMR。我正在使用CLI webpack dev服务器。可以看到更改并且webpack重新编译，但站点不会重新加载。

控制台日志：

[Log] [WDS] Hot Module Replacement enabled.
[Log] [WDS] App updated. Recompiling... (x2)
[Log] [WDS] App hot update...
[Log] [HMR] Checking for updates on the server...
[Warning] [HMR] Update failed: parse@[native code]
onreadystatechange@http://localhost:8080/assets/vendor.js:67:38

此错误是注入的Webpack代码的一部分：

request.onreadystatechange = function() {
     ...
  var update = JSON.parse(request.responseText); <-- this breaks

我的代码基本上是这样的：https://github.com/jaredpalmer/react-production-starter，除了我把它切换到Koa2。一路上我出于各种原因无法在HMR中使用构建，所以现在我正在使用外部服务器。

我的配置：

{
  devtool: 'eval',
  entry: {
    main: [
     path.join(process.cwd(), 'client'),
    ],
    vendor: [
      'react',
      'react-dom',
      'react-router',
      'redux',
      'react-redux',
      'aphrodite'
    ]
  },
  output: {
    filename: '[name].js',
    chunkFilename: '[name].chunk.js',
    publicPath: '/assets/',
    path: path.join(process.cwd(), 'public/assets')
  },
  module: {

    loaders: [
      {
        test: /\.js$/,
        loader: 'babel',
        exclude: /(node_modules|server)/,
        query: {
          cacheDirectory: false,
          presets: ["es2015", "react", "stage-0"]
        }
      },
    ]
  },
  plugins: [
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('development'),
      '__DEV__': true
    }),
    new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js', 2),
    new webpack.NoErrorsPlugin()
  ],
}

我用：

调用webpack服务器

webpack-dev-server --config tools/webpack.client.dev.js --hot --inline

可能是什么问题？似乎webpack正在接收解析的无效信息，但我不知道应该是什么或来自哪个。

客户端index.js文件与here相同。

我重新安排了提供初始渲染但却非常相似的代码。这是原始server code。主要是我把它变成了一个全能的路线router.all('*')并且稍微改变了html但是大部分它都是相同的。以下是脚本标记：

 <script>window.renderedClassNames = ${JSON.stringify(data.css.renderedClassNames)};</script>
 <script>window.INITIAL_STATE = ${JSON.stringify(initialState)};</script>
 <script src="${ env === 'production' ? '/assets/vendor.js' : 'http://localhost:8080/assets/vendor.js'}" ></script>
 <script async src="${ env === 'production' ? '/assets/main.js' : 'http://localhost:8080/assets/main.js'}" ></script>

client/index.js文件底部包含此内容：

if (module.hot) {
  module.hot.accept('../common/routes/root', () => {
    unsubscribeHistory()
   setTimeout(render)
  })
 }

然而，它从未被召唤过。

有人可以解雇吗？

Webpack HMR在解析错误时中断

0 个答案: