首先用vue-cli3创建工程，我的全局安装了vue-cli2，又不想卸载掉；所以新建了一个文件夹安装vue-cli3；然后在该文件夹下创建工程；
同时安装vue-cli2和vue-cli3参考：https://segmentfault.com/a/1190000020487946
工程创建好后，默认不带vue.config.js文件
新建两个文件夹，users和roles，相当于两个单页面应用工程一样；里面分别新建对应的js，vue文件，有需要也可以添加对应的route，vuex，引入Element-UI等；
新建vue.config.js，将下列参数加进去，其中pages字段就是多页面应用的关键配置字段
module.exports = { publicPath:process.env.NODE_ENV==='production'?'./':'/', pages:{ users:'src/pages/users/users.js', roles:'src/pages/roles/roles.js', }, configureWebpack:{ name:'多页面应用' } }
其中pages字段是vuecli官方提供的可配置字段
按照上面的配置，在public文件夹下添加user.html，为了方便，我把入口改成了字符串格式，里面的js，vue文件都用user来命名
user.js和原先单页面应用的mian.js是一样的，user.vue和之前的app.vue也是一样的；也可以有自己的嵌套路由；
user.js内容：
user.vue内容：
然后在public文件夹中添加user.html
同样的，roles里面目录结构也是一样的，代码构成也类似；
npm run serve启动页面后，页面显示正常如图所示：
npm run build将页面打包后预览dist里面的文件：
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/159661.html
