这里require和import的区别不太明白

来源：4-12 Mock设置（1）

慕莱坞0998854

2020-02-23

老师说，import是在预编译阶段就会加载，require在预编译阶段不会加载。那我想问下预编译是哪个阶段啊，老师的演示代码是

	if(mock){
		require()
	}

老师的意思是说webpack打包的阶段，如果使用import的方式的话，就没法用if和else进行选择性的加载吗？

写回答

3回答

cyper

2020-07-19

我查了一下vue-router中用的是import函数，和文件顶部的import语句是不一样的， import函数也是动态加载文件，并且是在运行时，他是javascript新增加的函数， chrome浏览器已经支持了。

import('xxxx.js').then(res=> {console.log(res)})

和require不同， require是node端用的（webpack用的）。他是同步的（语句会阻塞）， import(..)是浏览器直接支持的，他是异步的，返回Promise。

cyper

官方文档，除了IE，其他浏览器都支持使用import动态导入模块了： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import#Dynamic_Imports 这个就是你提到的vue-router中动态导入component使用的函数

2020-07-19

共1条回复