详解VueCLI3多页应用实践和源码设计-创新互联

 对于一个网站来说,即需要h6页面也同时需要web页面,而h6和web页面共用很多代码,不做响应式,只能拆分两个页面来写,一个h6,一个web.用vue cli3怎么配置h6与web的应用呢?

成都创新互联科技有限公司专业互联网基础服务商,为您提供香港机房服务器托管高防主机,成都IDC机房托管,成都主机托管等互联网服务。

解决思路:


首先,需要产生多页面应用,用webpack配置成多页面应用,一个h6一个web,这个网上已经有很多教程了,下面会再整理一次,接着把所有公共的代码提到多页面目录外面.

我们看一下官网给的 multi-page 的配置:需要在 vue.config.js 配置 pages,示例如下:

pages: {
 index: {
  // page 的入口
  entry: 'src/index/main.js',
  // 模板来源
  template: 'public/index.html',
  // 在 dist/index.html 的输出
  filename: 'index.html',
  // 当使用 title 选项时,
  // template 中的 title 标签需要是 <%= htmlWebpackPlugin.options.title %>
  title: 'Index Page',
  // 在这个页面中包含的块,默认情况下会包含
  // 提取出来的通用 chunk 和 vendor chunk。
  chunks: ['chunk-vendors', 'chunk-common', 'index']
 },
 // 当使用只有入口的字符串格式时,
 // 模板会被推导为 `public/subpage.html`
 // 并且如果找不到的话,就回退到 `public/index.html`。
 // 输出文件名会被推导为 `subpage.html`。
 subpage: 'src/subpage/main.js'
 }

文章题目:详解VueCLI3多页应用实践和源码设计-创新互联
网址分享:http://bzwzjz.com/article/ggdde.html

其他资讯

Copyright © 2007-2020 广东宝晨空调科技有限公司 All Rights Reserved 粤ICP备2022107769号
友情链接: 网站设计 成都定制网站建设 企业网站设计 成都网站设计 网站设计 营销型网站建设 重庆企业网站建设 重庆网站建设 成都营销网站建设 网站建设 广安网站设计 盐亭网站设计 成都网站制作 阿坝网站设计 成都网站建设 成都定制网站建设 古蔺网站建设 品牌网站建设 成都网站建设公司 网站建设方案 网站制作公司 企业网站设计