假设我有一个对象
const human = {
talk,
sleep,
eat,
};
现在我想要在另一个 js 文件中引入这个对象中的方法,就像下面这样。
import { eat, talk } from './human';
那么我的 export 语句该怎么写呢?
之前用 module.exports 语句是可以实现的,但听说混用不太好。
module.exports = human;
export default human
这样?
module.exports = human; 没问题啊,export default human 我知道 ts 这样用
module.exports 和 export default 输出都是 human 对象,想直接解构用 就 export const talk 这样用的时候就是
import { talk } from './human'
看一遍就知道了
http://es6.ruanyifeng.com/#docs/module
所以怎么整? 我今天也想这样来着,
感觉需要用 dynamic export
$export(xxx)
https://medium.com/@WebReflection/javascript-dynamic-import-export-b0e8775a59d4
请认真看文档
如果你想要 export 的对象,里面的属性是写死的话,就可以直接:
export default { eat: human.eat, sleep: human.sleep };
但如果你想要实现的和我的一样,是希望 export 能够不要关心 human 里面有什么属性,可以结合 commonjs:
module.exports = human;
这样的话,就能够使用 import { eat, sleep } 来引入了。
不过有一个问题,我在写 vue 的时候,是需要改 babel.config.js 才能这么做的。所以我才想要试着只用 ES6 来尝试这个效果,而不是混用。
export default a
等同于 export { default: a }
export 是不能使用解构的,因为 export 是静态的,结构是 runtime 的
你需要 export { xxx: a.xxx, yyy:a.yyy } 手动指定。
如果使用 commonjs module,就可以随便操作。因为模块是运行时的
如果用 esmodule,就不允许存在不确定的 import export,不符合 esmodule 可以被静态分析的定义,自然就会报错
直接 export 对象就可以了 export const human ={}
另外你 import 的时候 这个 js 的名称要是 human.js
无解, 是正解, export 是静态的
试了下为啥 export { xxx: a.xxx, yyy:a.yyy } 这种也会提示冒号是 非法字符呢
建议看文档。
export { a as b }
我是这样写的:
export function talk () {}
export function sleep() {}
export fucntion eat() {}
export default human
export = human