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