vue pages 多入口項目 + chainWebpack 全局引用縮寫

項目結構

├── node_modules               # 項目依賴包目錄
├── build                      # 項目 webpack 功能目錄
├── config                     # 項目配置項文件夾
├── src                        # 前端資源目錄
│   ├── images                 # 圖片目錄
│   ├── components             # 公共組件目錄
│   ├── pages                  # 頁面目錄
│   │   ├── page1              # page1 目錄
│   │   │   ├── components     # page1 組件目錄
│   │   │   ├── router         # page1 路由目錄
│   │   │   ├── views          # page1 頁面目錄
│   │   │   ├── page1.html     # page1 html 模板
│   │   │   ├── page1.vue      # page1 vue 配置文件
│   │   │   └── page1.js       # page1 入口文件
│   │   ├── page2              # page2 目錄
│   │   └── index              # index 目錄
│   ├── common                 # 公共方法目錄
│   └── store                  # 狀態管理 store 目錄
├── .gitignore                 # git 忽略文件
├── .env                       # 全局環境配置文件
├── .env.dev                   # 開發環境配置文件
├── .postcssrc.js              # postcss 配置文件
├── babel.config.js            # babel 配置文件
├── package.json               # 包管理文件
├── vue.config.js              # CLI 配置文件
└── yarn.lock                  # yarn 依賴信息文件

vue config.js 配置

pages: {
        page1: {
            entry: "src/pages/page1/main.js",
            template: "public/index.html",
            filename: "index.html",
            title: "page1",
            chunks: ["chunk-vendors", "chunk-common", "page1"]
        },
        page2: {
            entry: "src/pages/page1/main.js",
            template: "public/index.html",
            filename: "page2.html",
            title: "page2",
            chunks: ["chunk-vendors", "chunk-common", "page2"]
        },
    },
    

需要默認打開某個項目時只需要 filename 設置爲 index.html 即可，否則需要 通過詳細 url 進入對應項目

										*如果有其他技術方案歡迎留言指正*

chainWebpack 全局引用縮寫

chainWebpack: config => {
        config.resolve.alias
            .set("@", resolve("src")) // key,value自行定義，比如.set('@@', resolve('src/components'))
            .set("_c", resolve("src/components"))
            .set("_js", resolve("src/assets/js"));
    },