0
Webpack-dev-serverがホットリロードされていません。代わりに、ページ全体がリロードされて状態がリフレッシュされています。Webpack-dev-serverがホットリロードされていません
マイwebpack.config
entry: {
"app": [
"webpack-dev-server/client?http://localhost:3000/",
'webpack/hot/dev-server',
"./src/index.js",
],
"vendor": [
"webpack-dev-server/client?http://localhost:3000/",
'webpack/hot/dev-server',
"react", "react-router", "react-dom", "redux", "react-redux", "redux-logger", "redux-thunk"
]
},
output: {
path: path.join(__dirname, 'build'),
filename: DEV ? 'js/app.bundle.js' : 'js/app.[chunkhash:6].js',
publicPath:'http://localhost:3000/'
},
package.json
"start": "webpack-dev-server --progress --inline --hot --history-api-fallback --port 3000"
のsrc/index.js
window.addEventListener('DOMContentLoaded',() => {
let container = document.getElementById(appName);
if (!container) {
container = document.createElement('div');
container.id = appName;
container.className = appName;
document.body.appendChild(container);
}
render(<ProviderComponent />, container);
if (module.hot) {
// Whenever a new version of App.js is available
module.hot.accept('./provider', () => {
// Require the new version and render it instead
const NextApp = require('./provider').default
console.log(NextApp);
render(<NextApp />, container)
})
}
});
provider.js
import React from 'react';
import { Router, browserHistory } from 'react-router';
import { Provider } from 'react-redux';
import Routes from './routes.js';
import clientStore from './clientStore.js';
class ProviderComponent extends React.Component {
constructor() {
super();
this.state = {};
}
render() {
return (
<Provider store={clientStore}>
<Router history={browserHistory}>{Routes}</Router>
</Provider>
);
}
}
export default ProviderComponent;
Web上で検索した後、私は多くの人が同様の問題に直面している知っているようになりました。私は自分のコードをもう一度見て、すでに異なるページで指摘されているすべての解決策を含んでいます。そして、私が紛失している他のwebpack内部の複雑さがあるかどうかは分かりません。