Vue 分模块打包
Vue 分模块打包
·
通过给vue项目配置多个出入口,同一个vue项目打包不同的应用项目
1、在src目录下新建applications目录,新增admin目录,admin目录下包括一下文件目录,
main.js,router.js 跟平常vue项目配置一样。
2、配置运行或者 打包项目应用入口,新建config.js 配置
const config = {
admin: {
pages: {
index: {
entry: "src/applications/admin/main.js",
template: "public/index.html",
filename: "index.html"
}
},
devServer: {
port: 8080, // 端口地址
disableHostCheck: true,
hot: true,
open: true,
// 设置代理
proxy: {
"/eopenhapi": {
target: "http://open.jdpay.com",
changeOrigin: true
},
"/hapi": {
target: "http://open.jdpay.com",
changeOrigin: true
}
}
}
},
warning: {
pages: {
index: {
entry: "src/applications/warning/main.js",
template: "public/index.html",
filename: "index.html"
}
},
devServer: {
port: 8081, // 端口地址
disableHostCheck: true,
hot: true,
open: true,
// 设置代理
proxy: {
"/api": {
//本地服务接口地址
target: "http://172.16.40.20:30103",
//远程演示服务地址,可用于直接启动项目
//target: 'https://saber.bladex.vip/api',
logLevel: "debug",
changeOrigin: true,
ws: true,
pathRewrite: {
"^/api": "http://172.16.40.20:30103"
}
}
}
}
},
config: {
pages: {
index: {
entry: "src/applications/taskConfigure/main.js",
template: "public/index.html",
filename: "index.html"
}
},
}
}
module.exports = config;
3、在 vue.config.js 引入 config.js文件,新增相应的配置,如下图
4、配置相应的项目启动和打包命令,需要安装cross-env,配置如下
5. 运行yarn dev:admin 运行起 admin项目
需要支持加QQ:953866349
更多推荐
已为社区贡献5条内容
所有评论(0)