vue.js之使用Vue CLI3开发多页面应用

1、安装:npm install -g @vue/cli
2、创建项目，public相当于原来的static，里面的index.html是项目的入口 ，src同以前一样。
注意的是，cli3.0没有build和config了， 想要配置的话，需要在项目根目录下创建vue.config.js文件
3、在vue.config.js中配置如下

module.exports = {
    pages: {
        test: {
            // 应用入口配置，相当于单页面应用的main.js，必需项
            entry: 'src/modules/test/test.js',
 
            // 应用的模版，相当于单页面应用的public/index.html，可选项，省略时默认与模块名一致
            template: 'public/test.html',
 
            // 编译后在dist目录的输出文件名，可选项，省略时默认与模块名一致
            filename: 'test.html',
 
            // 标题，可选项，一般情况不使用，通常是在路由切换时设置title
            // 需要注意的是使用title属性template 中的 title 标签需要是 <title><%= htmlWebpackPlugin.options.title %></title>
            title: 'test page',
 
            // 包含的模块，可选项
            chunks: ['test']
        },
        test2: {
            entry: 'src/modules/test/test2.js'
            template: 'public/test2.html',
            filename: 'test2.html',
            title: 'test2 page',
            chunks: ['test2']
        }
    }
}

4、在src/modules/test/test.js中添加如下配置

import Vue from 'vue'
import App from './test.vue'
Vue.config.productionTip = false

new Vue({
  render: h => h(App)
}).$mount('#app')