webpack中啟動(dòng)了模塊熱替換，也是全網(wǎng)頁刷新司志，不是局部更新甜紫！
這兩天在研究react-hot-loader如何應(yīng)用在react的項(xiàng)目中，之前webpack.dev.config.js配置中骂远，設(shè)置了devServer: { hot: true, ... }囚霸，plugins: [?new Webpack.HotModuleReplacementPlugin(), ... ]，更改了js/jsx 文件都是全網(wǎng)頁刷新激才，開始以為這就是熱更新拓型，且滿足現(xiàn)狀。而且修改了css/less文件后頁面不會(huì)刷新瘸恼，需要手動(dòng)刷新樣式才會(huì)生效劣挫，覺得不應(yīng)該手動(dòng)刷新但是也沒去找原因?yàn)槭裁磿?huì)這樣【i 服了me】。
想提高開發(fā)效率东帅，于是安裝react-hot-loader压固，看了網(wǎng)上別人寫的博客，以及官網(wǎng)后靠闭，需要配置webpack,我沒做配置（其實(shí)配置了也管用帐我，只是配置后我的eslint檢驗(yàn)變的更嚴(yán)厲了），直接在項(xiàng)目路由文件中使用：
import { hot, setConfig } from 'react-hot-loader';? const Routes = () => {} ;? export default hot(module)(Routes);
為什么不在app.js 入口文件中使用呢愧膀？因?yàn)槿肟谖募惺褂昧?lt;Router history={history}></Router>拦键，在入口文件中使用react-hot-loader出現(xiàn)警告：You cannot change <Router history>;
再說一下，安裝react-hot-loader后webpack以及.babelrc沒做任何配置檩淋，直接在路由文件中使用了芬为。且生效了。
但是，修改css/less 文件后媚朦，還是需要手動(dòng)刷新頁面樣式才會(huì)生效捡絮，此時(shí)還是不知道啥原因。后來在網(wǎng)上看到這篇章才然大悟使用react-hot-loader的一些問題莲镣，原來是我的webpack配置在開發(fā)環(huán)境中抽離了css（一般在生產(chǎn)環(huán)境中進(jìn)行抽離）,于是進(jìn)行了修改：
修改的意思是將樣式文件也打包到j(luò)s中，然后涎拉，然后修改了css/less 文件的樣式后頁面元素局部刷新了瑞侮。后來發(fā)現(xiàn)即使不添加react-hot-loader，將css/less打包進(jìn)js后鼓拧，修改樣式文件頁面也會(huì)熱更新的半火。
對(duì)于上面遇到的問題，主要是自己學(xué)的淺季俩，沒深入研究問題導(dǎo)致的钮糖，不說了，繼續(xù)學(xué)習(xí)吧酌住！
