以下是使用非默认导出的两个示例。第一个使用commonjs语法,第二个使用es6。为什么第一个例子有效,但不是第二个?
// commonjs --- works!
var ReactRouter = require('react-router')
var Link = ReactRouter.Link
// es6 --- doesn't work!
import ReactRouter from 'react-router'
var Link = ReactRouter.Link
我知道我可以使用import { Link } from 'react-router'
代替,但我只是试图了解每次导入的不同之处。
答案 0 :(得分:9)
import ReactRouter
仅导入默认导出。它不会导入您在ES6代码中尝试实现的命名导出对象。如果模块中没有默认导出,则ReactRouter
将为undefined
。
如上所述,import { Link } from 'react-router'
是导入单个命名导出的专用语法。
如果要将所有命名导出导入对象,可以使用import..as
语法:
import * as ReactRouter from 'react-router';
var Link = ReactRouter.Link
MDN有一个超级有用的列表,列出了所有不同类型的导入及其工作方式。