即使在配置后,React热负载也不起作用

时间:2017-09-09 05:38:23

标签: webpack babel react-hot-loader

安装了最新的react-hot-loader

yarn add react-hot-loader@next

更新了入口点:

entry: [
        'react-hot-loader/patch',
        'webpack-dev-server/client?http://localhost:8080',
        'webpack/hot/only-dev-server',
        './src/app.jsx'
    ],

为babel插件添加了反应热插拔器/ babel:

{
    test: /.jsx?$/,
    loader: 'babel-loader',
    include: path.resolve(__dirname, 'src'),
    exclude: /node_modules/,
    options: {
        presets: [['es2015', { modules: false }], 'react'],
        plugins: ['react-hot-loader/babel']
    }
},

添加了HMR插件

plugins: [
    new CopyWebpackPlugin([
        { from: 'src/index.html' }
    ]),
    new WriteFilePlugin(),
    new webpack.HotModuleReplacementPlugin()
],

二手AppContainer

import React from 'react';
import ReactDOM from 'react-dom';
import { AppContainer } from 'react-hot-loader';
import Home from './components/home';

const render = Component => {
    ReactDOM.render(
        <AppContainer>
            <Home />
        </AppContainer>,
        document.getElementById('react')
    )
};

render(Home);

if (module.hot) {
    module.hot.accept('./components/home', () => render(Home));
}

仍然无效。页面完全重新加载。

1 个答案:

答案 0 :(得分:0)

好的,经过一小时的谷歌搜索和阅读后想出这个。使用Webpack 2及更高版本,应将以下配置添加到devServer:

sports = driver.find_element_by_id("accordionMenu1_ulSports")
if sports.get_attribute("style") == "display: none;":
    driver.find_element_by_xpath('//ul[@id="menu_acc"]/li[3]/a').click()

soccer = driver.find_element_by_link_text("SOCCER")

在我提到的earlier Webpack documentation中,它建议:

  

确保使用--hot标志或   webpack.config.js中的HotModuleReplacementPlugin,但从不两者   与那种情况同时,HMR插件实际上就是   添加了两次,打破了设置。