Javascript node.js (ES6 / Babel) 中 import X 和 import * as X 的区别？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31386631/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Difference between import X and import * as X in node.js (ES6 / Babel)?
提问by left4bread
I have a node.js library libwritten in ES6 (compiled with Babel) in which I export the following submodules:
我有一个lib用 ES6 编写的 node.js 库（用Babel编译），我在其中导出了以下子模块：
"use strict";
import * as _config from './config';
import * as _db from './db';
import * as _storage from './storage';
export var config = _config;
export var db = _db;
export var storage = _storage;
If from my main project I include the library like this
如果从我的主项目中包含这样的库
import * as lib from 'lib';
console.log(lib);
I can see the proper output and it work as expected { config: ... }. However, if I try to include the library like this:
我可以看到正确的输出并且它按预期工作{ config: ... }。但是，如果我尝试包含这样的库：
import lib from 'lib';
console.log(lib);
it will be undefined.
会的undefined。
Can someone explain what is happening here? Aren't the two import methods supposed to be equivalent? If not, what difference am I missing?
有人可以解释这里发生了什么吗？这两种导入方法不应该是等效的吗？如果没有，我缺少什么区别？
回答by loganfsmyth
import * as lib from 'lib';
is asking for an object with all of the named exports of 'lib'.
正在请求一个对象，其中包含所有命名为“lib”的导出。
export var config = _config;
export var db = _db;
export var storage = _storage;
are named exports, which is why you end up with an object like you did.
被命名为导出，这就是为什么你最终得到一个像你一样的对象。
import lib from 'lib';
is asking for the defaultexport of lib. e.g.
要求default出口lib. 例如
export default 4;
would make lib === 4. It does not fetch the named exports. To get an object from the default export, you'd have to explicitly do
会让lib === 4. 它不获取命名的导出。要从默认导出中获取对象，您必须明确执行
export default {
config: _config,
db: _db,
storage: _storage
};
回答by tgrrr
Just adding to Logan'ssolution because understanding import with brackets, * and without solved a problem for me.
只是添加到Logan 的解决方案中，因为理解带括号的导入，* 并且没有为我解决问题。
import * as lib from 'lib';
is the equivalent of:
相当于：
import {config, db, storage} as lib from 'lib';
Where the * is similar to a wildcard that imports all of the export varfrom lib.
其中 * 类似于导入所有export varfrom lib的通配符。
export var config;
export var db;
export var storage;
Alternatively, using:
或者，使用：
import lib from 'lib';
Allows you to only access the default export:
允许您仅访问默认导出：
// lib.js
export default storage;
Using {} also only imports specific components from the module, which reduces the footprint with bundlers like Webpack.
使用 {} 也仅从模块导入特定组件，这减少了 Webpack 等打包程序的占用空间。
While:
尽管：
import storage, { config, db } from './lib'
would import all modules including export default storage;
将导入所有模块，包括 export default storage;
See Dan Abramov's answer: When should I use curly braces for ES6 import?
请参阅 Dan Abramov 的回答： 何时应使用花括号进行 ES6 导入？
回答by foxiris
import X from Y;is a syntax sugar.
import X from Y;是一种语法糖。
import lib from 'lib';
import lib from 'lib';
is equal to
等于
import { default as lib } from 'lib';
import { default as lib } from 'lib';
