多页应用使用webpack-dev-server如何配置entry,output?

发布于 2022-09-04 03:44:23 字数 1335 浏览 11 评论 0

因为前后端都写,后端用的jsp,原来是用eclipse跑起后端服务器,前端用的webpack做模块加载打包,但每次修改后都要刷新网页挺麻烦的,好像说双服务器模式热加载能很好解决,用eclipse跑后端服务器,再用webpack-dev-server开一个资源服务器,但我的项目是一个多页应用,有多个入口文件,
我的webpack配置如下,请教我使用webpack-dev-server需要如何更改entry,output配置?

entry: getEntry(), 
output: {
    path: distRoot, //文件输出目录,可获取到对象格式的入口文件{page1:page2Path,page2:page2Path}
    publicPath: "./", 
    filename: "[name].js"
},
    

function getEntry() {
    var jsPath = path.resolve(entryJsDir);
    // 获取入口js
    var dirs = fs.readdirSync(jsPath);
    var matchs = [],
        files = {};
    dirs.forEach(function(item) {
        matchs = item.match(/(.+)\.js$/);
        if (matchs) {
            files[matchs[1]] = path.resolve(entryJsDir, item);
        }
    });
    return files;
}

下面是我看到一篇文章: Webpack-dev-server结合后端服务器的热替换配置中的单页应用的配置,还不是很清楚如何修改成多页应用的配置!

entry: [
    'webpack-dev-server/client?http://0.0.0.0:9090',//资源服务器地址
    'webpack/hot/only-dev-server',
    './static/js/entry.coffee'
]

output: {
    publicPath: "http://127.0.0.1:9090/static/dist/",
    path: './static/dist/',
    filename: "bundle.js"
}

// Plugins中增加:
new webpack.DefinePlugin({
    'process.env.NODE_ENV': '"development"'
}),
new webpack.HotModuleReplacementPlugin()

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

灵芸 2022-09-11 03:44:23

http://www.jianshu.com/p/8adf...

entry你有几个js入口就要写几个,用数组形式就可以

比如你有页面3个
--page1

-index.js

--page2

-page2.js

--page3

-page3.js

那么这3个js都要引入entry 
软糖 2022-09-11 03:44:23

我也有这样的需求 不知道楼主解决了没有?

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文