Vue配置多页面，多入口【vue-cli3 配置登陆页面】

很久之前就想去配置一个非单页面的登陆页面，一直到今天才完成

我将给出最简单的代码，完成最基本的配置。需要更强的功能自己去加上

效果如下

第一步：创建登陆页面的文件

1-1：login.html

1-2:login.main.js login.router.js login.vue

login.main.js

import Vue from 'vue';import login from './login.vue';import router from './login.router';// import store from './store';Vue.config.productionTip = false;new Vue({  router,  render: h => h(login),}).$mount('#login');

login.router.js

import Vue from 'vue';import Router from 'vue-router';Vue.use(Router);export default new Router({  mode: 'history',  base: process.env.BASE_URL,  routes: [      ],});

login.vue

第二步：配置 vue.config.js

const baseUrl = '/';

before: function(app) {          const base = baseUrl.replace(/\/+$/, ''); // 移除尾部斜杠          app.get(`${base}/:page/*`, function(req, res, next) {            if (['login', 'index'].includes(req.params.page)) {              // 把 ///* 重定向到 ///              req.url = `${base}/${req.params.page}/`;              next('route');            } else {              next();            }          });        },

pages: {        login: {          entry: 'src/login/login.main.js',          template: 'public/login.html',        },        index: {          entry: 'src/main.js',          template: 'public/index.html',        },    },