我正在尝试利用 webpack 代码拆分。一切看起来都运行良好,webpack 正确地拆分了代码,依赖项,几乎和预期的一样。
除了我不能让它与热模块更换一起工作。
我成功加载 127.0.0.1:8009/main.js
但是 main.js 正在尝试加载 127.0.0.1:8001/assets/1.chunk.js
是否有意义?我肯定错过了什么。
我在 127.0.0.1:8001 运行我的节点服务器,在 127.0.0.1:8009 运行热中间件客户端
** main.js**
require.ensure([], function (require) {
var admin = require('./admin');
}, 'admin');
我的 Webpack 配置
const PATHS = {
root: __dirname,
client: path.join(__dirname, '../', 'browser', 'scripts'),
public: path.join(__dirname, '../', '../', 'public')
};
var webpackConfig = {
hotPort: process.env.PORT_HOT,
devtool: 'eval',
name: 'browser',
resolve: {
root: PATHS.root,
extensions: ['', '.js', '.jsx', '.styl'],
modulesDirectories: [
'node_modules',
PATHS.client,
],
},
entry: {
main: ['main', hotMiddlewareScript]
},
output: {
path: PATHS.public,
filename: '[name].js',
publicPath: '/assets/'
},
module: {
noParse: [
/lodash/
],
loaders: [
{
test: /\.js$|\.jsx$/,
exclude: /node_modules/,
loaders: ['babel']
}
},
};
简单的热服务器
const app = express();
const compiler = webpack(webpackConfig);
app.use(webpackDev(compiler, {
noInfo: true,
publicPath: webpackConfig.output.publicPath
}));
app.use(webpackHot(compiler));
app.listen(webpackConfig.hotPort);