import
import是ES6的語法刨啸；
使用
導入組件
import Vue from 'vue'
導入js泉孩、css漫拭、vue避消、less等文件
import login from '../views/login/login.vue'
import './styles/index.less'
導入第三方插件
import Vant from 'vant'
vue路由懶加載
實現(xiàn)路由懶加載的步驟
安裝 @babel/plugin-syntax-dynamic-import 包。
npm install --save-dev @babel/plugin-syntax-dynamic-import
在 babel.config.js 配置文件中聲明該插件顽冶。
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
],
plugins: [
[
'component',
{
libraryName: 'element-ui',
styleLibraryName: 'theme-chalk'
}
],
'@babel/plugin-syntax-dynamic-import'
]
}
將路由改為按需加載的形式欺抗，示例代碼如下：
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
const routes = [
//import具有變量提升機制，使用箭頭函數(shù)限制作用域强重，實現(xiàn)懶加載
{ path: '/login', component: ()=> import('路由組件的路徑') }
]
const router = new VueRouter({
routes
})
export default router
@import
style中的@import是style的語法绞呈，是在css中引用css文件
使用
導入css樣式
@import './icon.less';'
