javascript - 仅从 ES6 模块导入静态变量

Question

我有一个 common.js 文件，其中包含我的应用程序中使用的常用变量和方法，例如导航栏模块 (nav-bar.js) 和其他一些。

通常，我的应用程序中的每个模块都需要导入整个 common.js 模块，登录模块除外。这只需要在 common.js 上定义的内容之一。

如果我使用命名导入来做类似的事情:

$ import {RestURL} from "./common";

我意识到，是的，我可以在我的登录模块中使用 RestURL const，但是在 common.js 中导入的所有模块也被导入，包括 nav-bar 模块，它执行我不想被执行的代码.

我想知道...有没有像静态变量一样只导入相应的变量 RestURL，而不运行所有 common.js 代码，也就是说，不导入在 common.js 文件中导入的所有模块，例如 nav -bar.js 模块？

谢谢!!!

// -- common.js ---------------------------------------------------
import '../inc/nav-bar';        // NAV-BAR JS

export const RestURL = {
    login:          '/services/b2b/v2/login',
}
// -- end of common.js module -------------------------------------



// -- login.js ----------------------------------------------------
import {RestURL} from "./common";

console.log(RestURL.login);
// -- end of login.js module --------------------------------------

我需要在 login.js 模块中使用 RestURL const，但我不想导入 nav-bar.js，因为其中有代码在加载 login.js 时不需要执行。使用命名导入方法，我设法访问了 const RestURL，但是导航栏模块也被加载了......:(

Answer 1

您可以将模块分成两个并在两个模块中导入。

// -- const.js ---------------------------------------------------

export const RestURL = {
    login:          '/services/b2b/v2/login',
}
// -- end of const.js module -------------------------------------


// -- common.js ---------------------------------------------------
import '../inc/nav-bar';        // NAV-BAR JS
import {RestURL} from './const.js'

// -- end of common.js module -------------------------------------




// -- login.js ----------------------------------------------------
import {RestURL} from './const.js'

console.log(RestURL.login);
// -- end of login.js module ----