从ES6模块仅导入静态变量

Question

我有一个名为common.js的文件，其中包含了我的应用程序中使用的常见变量和方法，例如导航栏模块（nav-bar.js）以及其他一些内容。

通常情况下，我的应用程序中的每个模块都需要导入整个common.js模块，除了登录模块。这个模块只需要在common.js中定义的一个常量。

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

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

我知道，是的，我可以在我的登录模块中使用RestURL常量，但所有在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常量，但我不想导入nav-bar.js，因为其中有一些代码在加载login.js时不需要被执行。通过命名导入的方法，我成功地访问了RestURL常量，但是nav-bar模块也被加载了... :(

- ÁngelBlanco

---

https://dev59.com/F1oV5IYBdhLWcg3wVdo_ - Monica Acha

请查看JavaScript代码分割。 - Nino Filiu

@MonicaAcha 谢谢，我希望条件导入很快能够实现，我认为这是必须的！... :) - ÁngelBlanco

@NinoFiliu 非常感谢，但我认为链接已经损坏了... :| - ÁngelBlanco

@ÁngelBlanco 什么链接？我只是建议你在JavaScript代码拆分方面进行一些研究。 - Nino Filiu

哎呀...好的！谢谢！ - ÁngelBlanco

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 ----

- StateLess

---

非常感谢，目前这是最好的方法，如果我只需要代码的这一部分，我可以将其作为独立模块包含... :) - ÁngelBlanco