如何在 ES6 模块中对函数进行分组?
How do I group functions in ES6 Modules?
如何在 ES6 模块包中对函数进行分组?在 CommonJS 包中你可以这样做。
// package.js
const startSession = require("./startSession");
module.exports = {
hooks: {
startSession,
},
};
// client.js
const { hooks: {startSession } } = require("package");
// OR
const { startSession } = require("package").hooks;
似乎不支持 ES6 代码中的类似语法。
import { hooks: {startSession } } from "packageX";
来源是 2016 年的 babel 问题。https://github.com/babel/babel/issues/4996
另一个是官方文档,并没有真正提到这种语法。
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import
解决方案
ES6 javascript 中的一个解决方案是这样的。
// package.js
import startSession from "./hooks/start-session";
export const hooks = {
startSession
};
// client.js
import { hooks } from "package";
const { startSession } = hooks;
但我想将导入写在一行中。也许不可能?
这不是我要找的。
import { hooks } from "package"; const { startSession } = hooks;
这种语法会很好,但如果可能的话,你如何设置包?
import { startSession } from "packageX/hooks";
import { startSession } from "packageX".hooks;
还有其他建议吗?
回答
下面的 Estus 将我推向了正确的方向。这里有一个更详细的答案。
// package.json
"main": "src/index.js",
"exports": {
".": "./src/index.js",
"./hooks": "./src/hooks/index.js",
}
// src/hooks/start-session.js
export default () => {}
// src/hooks/index.js
export * as startSession from "./start-session";
// src/index.js
export const doSomething () => {}
// client.js
import { doSomething } from "packageX";
import { startSession } from "packageX/hooks";
ES 模块应该进行静态分析,因此不可能从表达式中嵌套导入。导入语法不是解构的,只是看起来相似。是strictly specified;如果某项功能不存在,则表示不支持。
最好避免这种情况,因为这会阻止 hooks
属性被 tree-shaking(目前不适用于 Node)。
对于入口点或桶模块,前缀可用于为导出提供范围:
export { default as hookStartSession } from "./hooks/start-session";
这是一种通常在导入具有一定范围时执行的方法,至少如果包公开了额外的 public 入口点。
import { startSession } from "packageX/hooks"
如何在 ES6 模块包中对函数进行分组?在 CommonJS 包中你可以这样做。
// package.js
const startSession = require("./startSession");
module.exports = {
hooks: {
startSession,
},
};
// client.js
const { hooks: {startSession } } = require("package");
// OR
const { startSession } = require("package").hooks;
似乎不支持 ES6 代码中的类似语法。
import { hooks: {startSession } } from "packageX";
来源是 2016 年的 babel 问题。https://github.com/babel/babel/issues/4996
另一个是官方文档,并没有真正提到这种语法。 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import
解决方案
ES6 javascript 中的一个解决方案是这样的。
// package.js
import startSession from "./hooks/start-session";
export const hooks = {
startSession
};
// client.js
import { hooks } from "package";
const { startSession } = hooks;
但我想将导入写在一行中。也许不可能?
这不是我要找的。
import { hooks } from "package"; const { startSession } = hooks;
这种语法会很好,但如果可能的话,你如何设置包?
import { startSession } from "packageX/hooks";
import { startSession } from "packageX".hooks;
还有其他建议吗?
回答
下面的 Estus 将我推向了正确的方向。这里有一个更详细的答案。
// package.json
"main": "src/index.js",
"exports": {
".": "./src/index.js",
"./hooks": "./src/hooks/index.js",
}
// src/hooks/start-session.js
export default () => {}
// src/hooks/index.js
export * as startSession from "./start-session";
// src/index.js
export const doSomething () => {}
// client.js
import { doSomething } from "packageX";
import { startSession } from "packageX/hooks";
ES 模块应该进行静态分析,因此不可能从表达式中嵌套导入。导入语法不是解构的,只是看起来相似。是strictly specified;如果某项功能不存在,则表示不支持。
最好避免这种情况,因为这会阻止 hooks
属性被 tree-shaking(目前不适用于 Node)。
对于入口点或桶模块,前缀可用于为导出提供范围:
export { default as hookStartSession } from "./hooks/start-session";
这是一种通常在导入具有一定范围时执行的方法,至少如果包公开了额外的 public 入口点。
import { startSession } from "packageX/hooks"