在ESModules中从复杂路径导入模块的最佳方法是什么？

Question

在CommonJS中，我使用这种方式。

require(constant.APPROOT + "/lib/utils.js")

而不是

require("../../../../../../lib/utils.js")

但是，它不能在ESModules中工作。

import util from constant.APPROOT + "/lib/util.js"
// Uncaught SyntaxError: Unexpected identifier

我知道原因，因为它不是静态的。

我试过两种方法。

1st

import path from "path"
import fs from "fs"
import foo from "./foo.js"
import bar from "../../../../../lib/bar.js"
import util from "../../../../../lib/util.js"

// application code

2nd

import path from "path"
import fs from "fs"
import foo from "./foo.js"

!async function main(){
   const [bar, util] = await Promise.all([
       import(constant.APPROOT + "/lib/bar.js"),
       import(constant.APPROOT + "/lib/util.js"),
   ])

   // application code

}()

我觉得两者都不好。最好的方法是什么？

Answer 1

1. Webpack

您可以使用webpack设置别名(如果您正在构建一个节点应用程序，然后在您的配置中设置target: node，那么就有很多关于如何实现这一点的好指南)：

  resolve: {
    ...,
    alias: {
      '$lib': constant.APPROOT + "/lib"
    }
  }

然后导入-> import util from "$lib/util.js"

2.国家预防机制一揽子计划

您可以使用此包在package.json -> https://github.com/ilearnio/module-alias中设置别名。