vuecli3.0 多页面应用配置

4 配置为多页面应用

  4.1 项目配置

 //

// 多页面配置
    pages: {
        index: {
           entry: 'src/index/main.js',
           template: 'public/index.html',
           filename: 'index.html' 
        } ,
        home: {
          entry: 'src/home/main.js',
          template: 'public/home.html',
          filename: 'home.html'
        }  
    }

 

项目测试  所以只建立了两个入口  也差不多够了

4.2 目录结构 (详细解释目录的具体意义)

vuecli3.0 多页面应用配置_第1张图片

 

4.3 项目效果

开发中

vuecli3.0 多页面应用配置_第2张图片

vuecli3.0 多页面应用配置_第3张图片

vuecli3.0 多页面应用配置_第4张图片

vuecli3.0 多页面应用配置_第5张图片

 

 

 

 

打包后

vuecli3.0 多页面应用配置_第6张图片

vuecli3.0 多页面应用配置_第7张图片

 

 

打包与开发的某一个区别 (没啥意义  稍微提起来)

vuecli3.0 多页面应用配置_第8张图片

vuecli3.0 多页面应用配置_第9张图片

 

 

就是对于页面404时的监听

 

4.4  问题与完善

   1 路由模式的影响

     由于最开始默认为history模式  所以在点击路由的时候,

页面展示效果一直有问题

改为hash就OK了

   2 路由跳转

   两个页面的跳转问题需要使用 a 标签

   index

你可能感兴趣的:(知识)