前端模块导入导出方式

不同的导出方式和相应的导入方式，可以提炼成 3 种类型：name、default 和 list。

以下是使用示例：

// Name Export | Name Import
// 一个“命名”的导出
export const name = 'value'
import { name } from '...'

❌ 错误示例：
export 'value'
import { } //错误：没有名字

***************************************************************
// 混合默认值 + 名称
// 您绝对可以将默认和名称导出合并到一个文件中
export const name = 'value';
export default 'value'
import anyName, { name } from 'some-path/file';

***************************************************************
// Default Export | Default Import
// 使用默认导出时，您不需要任何名称。因为你可以随心所欲地命名它
export default 'value'
import anyName from '...'

❌ 错误示例：
export default const name = 'value';  //错误：无默认变量声明

***************************************************************
// Rename Export | NameImport
// 重命名导出
const name = 'value'
export { name as newName }
import { newName } from '...'
console.log(newName); // 'value'
console.log(name ); // undefined

❌ 错误示例：无法将内联导出与导出列表组合在一起
export const name = 'value';
// You're already exporting name ☝️, don't export me again
export {
  name
}

***************************************************************
// Name + Default | Import All
// 全部导入
export const name = 'value'
export default 'value'
import * as anyName from '...'
console.log(anyName.name); // 'value'
console.log(anyName.default); // 'defaultValue'

***************************************************************
// Export List + Rename | Import List + Rename
// 导出列表
// 重命名导入
export {
  name1,
  name2 as newName2  
}
import {
  name1 as newName1,  //重命名导入
  newName2
} from '...'

❌ 错误示例：
// Export list ≠ Object
export {
  name: 'name'
}