ES6中export和export default

export与export default均可用于导出常量、函数、文件、模块

你可以在其它文件或模块中通过import+(常量|函数|文件|模块)名的方式，将其导入，以便能够对其进行使用

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

通过export方式导出，在导入时要加{ }，export default则不需要

其实很多时候export与export default可以实现同样的目的，只是用法有些区别。注意第四条，通过export方式导出，在导入时要加{ }，export default则不需要。使用export default命令，为模块指定默认输出，这样就不需要知道所要加载模块的变量名。

//demo1.js

export const str = 'hello world'

export function f(a){

    return a+1

}

对应的导入方式：

//demo2.js

import { str, f } from 'demo1' //也可以分开写两次，导入的时候带花括号

//demo1.js

export default const str = 'hello world'

对应的导入方式：

//demo2.js

import str from 'demo1' //导入的时候没有花括号

可以用最新的webpack去测试，最新的webpack已经内置支持了es6的模块语法。

webpack.config.js

const pathlib=require('path');

module.exports={

  mode: 'development',

  entry:'./js/main',

  output:{

    path:pathlib.resolve('dest'),

    filename:'bundle.js'

  }

}

js/main.js

import {fn} from './a';

import b from './b';

console.log(`a的值是${fn}`);

console.log(`b的值是${b}`);

js/a.js

function fn(){

  return {

    a:1000,

    age:21111111

  }

}

export {fn};

js/b.js

export default {

  name:'bbbbbbbbb',

  age:122222222222

}

es6 import {} 和 import * 有什么区别

export default 用import *

export const * 用 import {}

import * as a from 'xxx'

import { b, c } from 'xxx'

这两种方式前者引入模块所有导出内容，并打包(取一个别名)为a.
后者只导入模块导出的b和c这个内容。

当前页面要引入模块xxx的多个导出时，可以用第一种方式，代码可以写的简洁一些，并且不会污染当前命名空间。