export和export default的区别

的使用

1.直接输出

export let words = 'hello world!!!' 

export function output() { 
// ... 
}

2.先定义再输出

let firstWords = 'hello'
let secondWords = 'world'
let thirdWords = '!!!'

function output() {
    // ...
}

export {firstWords, secondWords, thirdWords, output}

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19

default的使用

default 用于规定模块的默认对外接口
2.很显然默认对外接口只能有一个，所以 export default 在同一个模块中只能出现一次
default只能直接输出，不能先定义再输出。

export default const str = 'hello world'

export default function () {
  console.log('foo');
}

• 1
• 2
• 3
• 4
• 5

和export default在import时区别

1. export的输出与import输入
export function output() {
    // ...
}

import {output} from './example'

2.export default的输出与import输入
export default function output() {
    // ...
}

import output from './example'

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13

从以上两种 import 方式即可看出，export default 的 import 方式不需要使用大括号包裹。因为对于 export default 其输出的本来就只有一个接口，提供的是模块的默认接口，自然不需要使用大括号包裹。

参考文章：
/sherrycat/p/
/fanyanzhao/p/
/zhou_xiao_cheng/article/details/52759632