export , export default ,module.exports 的区别

CommonJS模块规范和ES6模块规范完全是两种不同的概念

1.module.exports 与 require

Node应用由模块组成,采用CommonJS模块规范。

根据这个规范,每个文件就是一个模块,有自己的作用域。在一个文件里面定义的变量、函数、类,都是私有的,对其他文件不可见。

CommonJS规范规定,每个模块内部,module变量代表当前模块。这个变量是一个对象,它的exports属性(即module.exports)是对外的接口。
加载某个模块,其实是加载该模块的module.exports属性。

function clear() {
  uni.clearStorageSync();
}
module.exports = {
      clear:clear,
}

上面代码通过module.exports输出函数 clear

var example = require('./example.js'); // 导入方法一
import example from './example.js'// 导入方法二
console.log(example.x);

不同于CommonJS,ES6使用 export 和 import 来导出、导入模块。

export命令规定的是对外的接口,必须与模块内部的变量建立一一对应关系

重点:

在一个文件或模块中,export、import可以有多个,export default仅有一个

2. export

通过export方式导出,在导入时要加{ },

export  const a  = "hello world";
// 导入方式:
import {a} from 'demo2.js'; //这里的a必须与导出的变量名一致

3.export default

通过export default方式导出, 在导入时可以自定义变量名, 这个变量名是一个对象

export default const a  = "hello world"; 
// 导入方式
import b from 'demo2.js';//这里的b可以是任意变量, 这个变量是一个对象

4.模块整体加载(接口常用) * as

// moudules/login.js 接口
import axios from '../axios' // 引入二次封装后的axios
export const lianLogin= (data) => {
    return axios.axioseRquest({
        url: '/Sys_User/GetToken',
        method: 'post',
        data

    })
};

// api.js 接口统一集成模块
import * as login from './moudules/login' //系统-系统认证(登录)
export default{
      login
}

// main.js 注入到vue原型里
import api from './http'
Vue.prototype.$api = api

// 使用
this.$api.login.lianLogin(请求参数).then()...
原文地址:https://www.cnblogs.com/cl1998/p/14326060.html