export default和module.exports
我期望理解，但是也慢慢地感受到了一种责任，给予比接受伟大，去爱比被爱伟大。 ——海明威
我们在vue项目中创建两个js
image-20211123202050195
在util.js中写入
export default {
ruben: 'ruben'
}在api.js中写入
module.exports = {
vampire: 'vampire'
}我们再来一个页面中使用两种方式引用
<script>
import util from '@/common/util.js';
import api from '@/common/api.js'
const util1 = require('@/common/util.js')
const api1 = require('@/common/api.js')
export default{
created(){
console.log("util.ruben: ",util.ruben);
console.log("api.vampire: ",api.vampire);
console.log("util1.ruben: ",util1.ruben);
console.log("api1.vampire: ",api1.vampire);
}
}
</script>输出结果为：
image-20211123202538787
我们可以看到使用require引入util.js中写的export default失败了
因为require是CommonJS中的语法，Node 应用由模块组成，采用 CommonJS 模块规范
而CommonJS暴露模块采用的语法是module.exports
但是export default则是ES6中的新语法，它的效率要比CommonJS高，配套的是import
并且import是编译时执行，所以无法做到像require一样动态加载
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2021-11-23，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读