1.vue的异步组件，require()方法
作用是：在需要使用的时候，从 根目录/components/HelloWorld.vue 加载组件
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'HelloWorld',
component: resolve => require(['@/components/HelloWorld'], resolve),
}
]
})
如果不用懒加载代码应该是这样：
import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'HelloWorld',
component: HelloWorld
}
]
})
2.关于export default 和 export
一、export和export default
export和export default都用于导出常量、函数、文件、模块等，区别是：
1、在一个JS文件中，export可以有多个；export default只能有一个；
2、它们的引用方式不同；
二、import用于引入一个JS文件：
1、如import引入的是依赖包，则不需要相对路径；
2、如import引入的是自定义的JS文件，则需要相对路径；
3、import使用export导出的需要用{}，使用export default导出的不需要{}；
例如：export导出的引用
//d1.js
//d1.js是用export导出的
export const str = 'hello world'
export function f0(a){
return a+1
}
export const f1 = (a,b) => {
return a+b
}
export const f2 = (function () {
return 'hello'
})()
引用方式：
//d2.js
//在d2.js中引用d1.js,d1.js是使用export导出的变量和函数，引用时要使用{}；
import { str,f0,f1,f2 } from 'd1' //名字要和export相同，d2.js和d1.js在同目录，如不同目录则 from '../../d1.js'，扩展名可以不写
const a = f1(1,2)
//也可以写成：
import {str} from 'd1'
import {f1} from 'd1'
用export default导出：
//d3.js
//用export default导出，JS文件中只能有一个
export default const str = 'hello world'
引用：
//d4.js
//引用d3.js，使用export default导出的，引用时不要{}
import str from 'd3' //名字可以任意
export default 批量导出：
//修改后的d3.js
export const str = 'hello world'
export function f0(a){
return a+1
}
export const f1 = (a,b) => {
return a+b
}
export default {
str,
f0,
f1
}
引用：
//修改d4.js
import d from 'd3' const a = d.f0(45)
3.对vue项目的大体理解
.png)
