什么 import {} from '.'做？答案

【问题标题】：What does import {} from '.' do?什么 import {} from '.'做？
【发布时间】：2019-12-12 12:42:17
【问题描述】：

我在看some source code of a library，我看到了这个导入

import {SheetsRegistry, JssProvider, withStyles} from '.'

这是做什么的？怎么导入from '.'？

【问题讨论】：

它从同一目录中的index.js 导入这些声明。
从同一文件夹中的index.ts 导入声明。
从与当前文件相同级别的index.js 文件导入。相当于./index
请注意，这不是由 JavaScript 定义的，而是由处理导入的环境定义的。
@Vencovsky - 只是模块说明符的含义由宿主环境决定，而不是由语言规范决定。 Bundler、Node.js 和浏览器都有自己的模块说明符语义（尽管——因为人们并不愚蠢——有很多重叠 :-)）。

标签： javascript reactjs ecmascript-6 import es6-modules

【解决方案1】：

您共享的代码从同一目录中的index.js 导入这些声明。

index.js:

// @flow
import withStyles from './withStyles'

export {ThemeProvider, withTheme, createTheming, useTheme} from 'theming'
export {default as createUseStyles} from './createUseStyles'
export {default as JssProvider} from './JssProvider'
export {default as jss} from './jss'
export {SheetsRegistry, createGenerateId} from 'jss'
export {default as JssContext} from './JssContext'
export {default as styled} from './styled'
export {default as jsx, create as createJsx} from './jsx'
export {withStyles}

// Kept for backwards compatibility.
export default withStyles

在此示例中，index.js 用于重新导出src 目录中的一些声明。这种模式可以更轻松地移动声明，而无需重写许多导入。

【讨论】：

【解决方案2】：

******命名导出和默认导出的区别。******

1 个命名的导出

Constant.js中的

导出函数、常量、变量...等

export const CREATE = 'CREATE';
export const DELETE = 'DELETE';

在 index.js

中像这样导入

import {CREATE,DELETE} from './Constants';

2-默认导出

在 Constant.js

中导出

const update = ()=> 'UPDATE'
export default update();

并在 index.js 中像这样导入

import UPDATE from './Constants';

【讨论】：