以下内容仅供学习使用
- 安装@babel/plugin-syntax-dynamic-import插件。
1.1 使用npm安装:
npm install --save-dev @babel/plugin-syntax-dynamic-import
1.2 使用yarn安装:
yarn add --dev @babel/plugin-syntax-dynamic-import
- 安装完成后,在您的babel配置文件(通常是.babelrc或babel.config.js文件)中添加@babel/plugin-syntax-dynamic-import插件。
2.1 例如,如果您使用.babelrc文件,您可以这样配置:
{
"plugins": ["@babel/plugin-syntax-dynamic-import"]
}
2.2 如果您使用babel.config.js文件,您可以这样配置:
module.exports = {
plugins: ['@babel/plugin-syntax-dynamic-import']
}
- 在路由配置中使用component: () => import('component/path')替换原有的component: ComponentName。
const login = () => import('@/views/login/index.vue')//第二种方法
const home = () => import('@/views/home/index.vue')
const routes = [
{
path: '/',
redirect: '/login'
},
{
path: '/login',
name: 'login',
//component:() => import('@/views/home/index.vue') 1、第一种方法
component:login //第二种方法
},
{
path: '/home',
name: 'home',
component: home
},
]
标签:babel,dynamic,syntax,component,vue2,import,home,路由,加载
From: https://www.cnblogs.com/Amyel/p/17264658.html