魔法注释#

/* webpackChunkName: "about" */

Vue中运用import的懒加载语句以及webpack的魔法注释，在项目进行webpack打包的时候，对不同模块进行代码分割，在首屏加载时，用到哪个模块再加载哪个模块，实现懒加载进行页面的优化。

在 Webpack 构建时，会避免加载已声明要异步加载的代码 ，异步代码会被单独分离出一个文件，当代码实际调用时被加载至页面。

webpack魔法注释的作用是对异步加载的模块打包生成的文件进行重命名，不设置的时候是0.js

1const routes = [
2  {
3    path: '/about',
4    name: 'about',
5    component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
6  }
7]