Closed wd2010 closed 1 year ago
In my webpack demo, I use router4+react16 . In my container , it can replace not refresh the whole page,but when i reset my reducer, it can`t replace and not reload. The link of the demo the link is https://github.com/wd2010/webpack-demo
const ExtractTextWebpackPlugin = require("extract-text-webpack-plugin"), HtmlWebpackPlugin=require('html-webpack-plugin'), ProgressBarPlugin = require('progress-bar-webpack-plugin'); const path=require('path'); const webpack=require('webpack'); import { ReactLoadablePlugin } from 'react-loadable/webpack'; const DIR_NAME=path.join(__dirname,'../'); const config={ context: DIR_NAME, entry:{ bundle: ['./client/app.js','webpack-hot-middleware/client?path=/__webpack_hmr'], vendor: ['react','react-dom','redux','react-redux'], }, output:{ path: path.resolve(DIR_NAME,'./dist/client'), filename: '[name].js', chunkFilename: 'chunk.[name].js', publicPath:'/' }, resolve: {extensions: ['.js', '.jsx' ,'.json', '.scss']}, module:{ rules: [ { test: /\.(js|jsx)$/, exclude: /node_modules/, use: { loader:'babel-loader', options:{ presets: ['env', 'react', 'stage-0','react-hmre'], plugins: ['transform-runtime', 'add-module-exports','syntax-dynamic-import','react-loadable/babel'], cacheDirectory: true, } } },{ test: /\.html$/, exclude:/node_modules/, loader: 'html-loader' } ], }, plugins:[ new webpack.optimize.OccurrenceOrderPlugin(), new webpack.HotModuleReplacementPlugin(), new webpack.NoEmitOnErrorsPlugin(), new ProgressBarPlugin({summary: false}), new webpack.optimize.CommonsChunkPlugin({ names:['vendor','manifest'], filename:'[name].js', }), new HtmlWebpackPlugin({ filename: '../views/dev/index.html', template: './views/tpl/index.html', chunks: ['vendor','manifest', 'bundle'], }), new ReactLoadablePlugin({ filename: './views/dev/react-loadable.json', }), ], } module.exports=config
import {createStore, applyMiddleware,compose} from "redux"; import thunkMiddleware from "redux-thunk"; import createHistory from 'history/createMemoryHistory'; import { routerReducer, routerMiddleware } from 'react-router-redux' const routerReducers=routerMiddleware(createHistory());//路由 const composeEnhancers = !!(typeof document !== 'undefined' && window)? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ : compose; const middleware=[thunkMiddleware,routerReducers]; let configureStore=({initialState,rootReducer})=>createStore(rootReducer,initialState,composeEnhancers(applyMiddleware(...middleware))); export default configureStore;
import React from 'react'; import {hydrate} from 'react-dom'; import configureStore from './store/configureStore'; import createHistory from 'history/createBrowserHistory' import createApp from './store/createApp'; import Loadable from 'react-loadable'; import rootReducer from './store/reducers/index.js'; const initialState = window.__INITIAL_STATE__; const store=configureStore({initialState,rootReducer}) const history=createHistory() //热加载配置 if(module.hot) { module.hot.accept('./store/reducers/index.js', () => { import('./store/reducers/index.js').then(newReducer=>{ store.replaceReducer(newReducer) }); }); } const render=()=>{ let application=createApp({store,history}); hydrate(application,document.getElementById('root')) } window.main = () => { Loadable.preloadReady().then(() => { render() }); };
[HMR] connected bundle.js:6781 [HMR] bundle rebuilding bundle.js:6789 [HMR] bundle rebuilt in 180ms bundle.js:7715 [HMR] Checking for updates on the server... bundle.js:7788 [HMR] Updated modules: bundle.js:7790 [HMR] - ./client/store/reducers/home.js bundle.js:7790 [HMR] - ./client/store/reducers/index.js bundle.js:7795 [HMR] App is up to date. bundle.js:6781 [HMR] bundle rebuilding bundle.js:6789 [HMR] bundle rebuilt in 195ms bundle.js:7715 [HMR] Checking for updates on the server... bundle.js:7788 [HMR] Updated modules: bundle.js:7790 [HMR] - ./client/store/reducers/home.js bundle.js:7790 [HMR] - ./client/store/reducers/index.js bundle.js:7795 [HMR] App is up to date. bundle.js:6781 [HMR] bundle rebuilding bundle.js:6789 [HMR] bundle rebuilt in 175ms bundle.js:7715 [HMR] Checking for updates on the server... bundle.js:7788 [HMR] Updated modules: bundle.js:7790 [HMR] - ./client/store/reducers/home.js bundle.js:7790 [HMR] - ./client/store/reducers/index.js bundle.js:7795 [HMR] App is up to date.
when I change the reducer,the page can`t reload
Closing due to inactivity. Please test with latest version and feel free to reopen if still regressions. Thanks!
In my webpack demo, I use router4+react16 . In my container , it can replace not refresh the whole page,but when i reset my reducer, it can`t replace and not reload. The link of the demo the link is https://github.com/wd2010/webpack-demo
my webpack.config.js
configureStore.js
app.js (the entry file)
when I change the reducer,the page can`t reload