1、router.js里面

{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
webpackChunkName

注释的webpackChunkName就类似于起了一个别名

参考地址:

https://router.vuejs.org/zh/guide/advanced/lazy-loading.html

把组件按组分块 (webpackChunkName的妙用)

有时候我们想把某个路由下的所有组件都打包在同个异步块 (chunk) 中。只需要使用 命名 chunk,一个特殊的注释语法来提供 chunk name (需要 Webpack > 2.4)。

const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')
const Bar = () => import(/* webpackChunkName: "group-foo" */ './Bar.vue')
const Baz = () => import(/* webpackChunkName: "group-foo" */ './Baz.vue')

https://webpack.js.org/guides/code-splitting/

												

Vue项目构建开发笔记(vue-lic3.0构建的)的更多相关文章

  1. vue项目的开发

    vue项目的开发 我们已经通过命令行创建了一个vue项目,并且打开了这个项目.下面是这个文件的src文件夹,这个文件夹放了整个项目的核心代码. 一.vue文件的用处简介. 1.assets文件夹,用来 ...

  2. 如何加快Vue项目的开发速度

    如何加快Vue项目的开发速度 本文摘自奇舞周刊,侵权删. 现如今的开发,比如内部使用的管理平台这种项目大都时间比较仓促.实际上来说,在使用了webpack + vue 这一套来开发的话已经大大了提高了 ...

  3. 加快Vue项目的开发速度

    巧用Webpack Webpack是实现我们前端项目工程化的基础,但其实她的用处远不仅仅如此,我们可以通过Webpack来帮我们做一些自动化的事情.首先我们要了解require.context()这个 ...

  4. vue.js应用开发笔记

    看vue.js有几天了,之前也零零散散的瞅过,不过一直没有动手去写过demo,这几天后台事比较少,一直在讨论各种需求(其实公司对需求还是比较重视与严谨的,一个项目需求讨论就差不多一周了,这要搁之前,天 ...

  5. 使用 typescript ,提升 vue 项目的开发体验(1)

    此文已由作者张汉锐授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 前言:对于我们而言,typescript 更像一个工具 官方指南 从 vue2.5 之后,vue 对 ts ...

  6. Vue项目的开发流程

    我先安装的node.js 1.确认已安装了node.js,可在cmd中输入( node -v和npm -v),如显示出版号,说明安装成功 2.安装webpack 和webpack-cli 在全局下安装 ...

  7. Vue项目中使用基于Vue.js的移动组件库cube-ui

    cube-ui 是滴滴公司的技术团队基于 Vue.js 实现的精致移动端组件库.很赞,基本场景是够用了,感谢开源!感谢默默奉献的你们. 刚爬完坑,就来总结啦!!希望对需要的朋友有小小的帮助. (一)创 ...

  8. 命令行创建 vue 项目(仅用于 Vue 2.x 版本)

    1 .安装 Node.js 和 npm ( 验证安装成功输入下图 1 命令行可得 2:输入命令行 3 可得 4 即安装成功) 2.安装全局 webpack (安装依照下图输入命令行 1 耐心等待至到出 ...

  9. VSCode 初次写vue项目并一键生成.vue模版

    VSCode 写vue项目一键生成.vue模版 1.新建代码片段 文件-->首选项-->用户代码片段-->点击新建代码片段--取名vue.json 确定 2.配置快捷生成的vue模板 ...

随机推荐

  1. setDefaultKeyMode设置Activity的五种按键模式

    setDefaultKeyMode (int mode) 用来设置一个Activity的默认的按键模式, mode一共有五种 DEFAULT_KEYS_DISABLE DEFAULT_KEYS_DIA ...

  2. 001_twoSum

    #####solution01##### # def twoSum(nums, target): # res=[] # for i in range(0,len(nums)-1): # p1 = nu ...

  3. tensorflow can not find libcusolver.so.8.0

    ImportError: libcusolver.so.8.0: cannot open shared object file: No such file or directory solution: ...

  4. Windows打开文件

    cmd中, windows  打开文件命令:start: Linux       打开文件命令:open

  5. A - 签到题

    给定一个长度为N的数组A=[A1, A2, ... AN],已知其中每个元素Ai的值都只可能是1, 2或者3. 请求出有多少下标三元组(i, j, k)满足1 ≤ i < j < k ≤ ...

  6. shiro--《跟我学Shiro》网友学习系列

    第八章 拦截器机制——<跟我学Shiro> - 开涛的博客—公众号:kaitao-1234567,一如既往的干货分享 - ITeye博客http://jinnianshilongnian. ...

  7. Android自定义控件三种方式

    1.组合原生控件(继承自ViewGroup.LinearLayout.FrameLayout.RelativeLayout等)   将原生空间做组合,自定义一些事件 2.自己绘制控件(继承自View) ...

  8. 2017 ACM/ICPC(北京)总结

    这个季节的,北京真的很冷. 下午的热身赛,我依然先去敲一道搜索题,但是很不幸这道搜索题坑点还是蛮多的,浪费了好长时间后依然没能A掉,期间Codeblocks崩溃一次使得代码完全丢失,在队友的建议下便暂 ...

  9. 搭建ubuntu14.04服务器必备环境

    1.  设置网络 设置网络时,一定要设置好网卡,第一个网卡一定要设置为‘br0’(如下图),设置为其他的上不去网. 修改网络配置文件,命令:sudo gedit /etc/network/interf ...

  10. DataGrid 查不出数据 注意事项

    总结以下几条:1.SQL文在数据控中查询成功在写入,表内字段名尽量复制,手打太容易错了.写SQL写错了,没有智能提示.2.DataGrid数据源先绑定.3.检查parameter顺序,条件的顺序也要考 ...