以下是使用非默认导出的两个示例。第一个使用 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'
来代替,但我只是想了解每个导入的不同之处。
最佳答案
import ReactRouter
仅导入默认导出。它不会导入命名导出的对象,而这正是您试图在 ES6 代码中实现的目标。如果模块中没有默认导出,则此 ReactRouter
将为 undefined
。
如上所述,import { Link } from 'react-router'
是导入单个命名导出的专用语法。
如果要将所有命名导出导入到一个对象中,可以使用import..as
语法:
import * as ReactRouter from 'react-router';
var Link = ReactRouter.Link
MDN有一个 super 有用的列表,列出了所有不同类型的导入及其工作原理。
关于reactjs - CommonJS 导入与 ES6 导入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37050932/