正确姿势使用vue cli3配置多页项目

多页面配置

我们在使用vue cli3脚手架构建页面时，大多都是单页应用（这其中的优势我就不多说了），但是在某些场景，我们需要构建多页应用，例如我们我们应用中有很多小型h5页面，或者多种活动页，这些页面互相之间没有什么关联，如果每个活动页面都构建一个应用，那也是不切实际的，所以我们需要使用vue脚手架构建多页应用，其中在vue-cli2.x版本配置多页需要修改的地方还是挺繁琐，不过好在cli3版本增加了pages属性，配置起来相当轻松。

项目源码地址 multi-pages

创建多页应用

首先 vue create multi-pages 初始化名为 multi-pages 的项目，我们删除views文件夹，新建一个名为pages 的文件夹，并创建 index 、 page1 、 page2 文件夹如下：

这里index代表了项目首页，page1、page2在这里可以理解为需要构建的其他页面，我们可以在各自的页面文件下创建属于他们的入口文件index.js(相当于单页应用的main.js)、 router路由、组件components、vuex、axios等等，我们就把他们每个理解为独立的单页应用。<