模块的导入导出方式总结导入的方式 import home from './home' 这种比较常见的导入方式，此时的ho

这种比较常见的导入方式，此时的home相当于一个对象，如果需要调用home中的Fun1, 可以通过home.Fun1来调用，或者通过结构的方式 const { Fun1 } = home。

import * as home from './home'，此时的home是一个module，比上面第一种情况相当于包了一层default属性，如果要调用home中的Fun1，可以通过home.default.Fun1来调用，或者通过结构的方式 const { Fun1 } = home.default。

import { Fun1 } from './home'，如果像第一种情况的home，通过解构home能直接获取Fun1，那我是否可以直接import的时候就结构呢？答案是：否。这个和webpack的编译有关，它导出的对象是在default属性上的，它编译后的结构是module.exports.default = {...}

如果你真想使用解构的方式，可以通过结构default属性import { default as test } from home(这里采用as重命名，是因为default是保留字段)；或者在导出时不添加default属性，如下图所示

    // test.js
    var a = 1;
    var fn = function() {
      console.log('test')
    }
    module.exports = {
      a,
      fn
    }

这个主要对应的commonJS的写法，像node或者webpack打包的那里经常会看到，如下图所示，如果通过require引入文件，它的输出是一个对象，包含module.exports里的所有属性，它可以通过解构的方式获取const { fn } = require('../home.js')

es导出的方式包含export/export default，其中export经过编译后它类似module.exports，export default 经过编译后它类似module.exports.default。而module.exports的导出是commonJS的方式。