ts 中的 import() 不是动态的？什么原因？

Question

根据MDN，import()是类函数动态方法。但是，我发现它在我的ts项目中不是动态的。

假设我有一个 appleShare.json:

{
    price: 123
}

然后，有一个 index.ts:

console.log("update the price to 456...")
// manually modify the json file content making price 456
let currentPrice = await import("./appleShare.json").then(obj=obj.price)
console.log(currentPrice)

我直接在运行index.tsvs-code，控制台结果：

update the price to 456...
123

我预计是 456，结果是 123。以我有限的知识，我猜想有两个可能的原因：

我对import()和动态导入有误解
我的理解是正确的，但是 vs-code 在执行它们之前将所有代码编译为 js。所以，我永远不会得到新修改的价格。

想请问一下，具体是什么原因造成的，如何解决？

Answer 1

“动态”import() 与通常称为“静态”导入的常规 import 有以下不同的行为。

您可以在代码中构建一个模块文件名，然后可以从您构建的文件名中加载该模块。您不能使用常规 import 动态构建模块文件名。常规 import 的文件名必须静态指定，以便解析文件的任何人都知道它们，但不会运行其中的代码。此静态声明支持对 tree-shaking 和捆绑等内容进行代码分析。动态导入无法有效地用于此类功能。
import() 可以发生在代码的任何地方（不仅在模块的顶部）。常规 import 不能出现在代码中的任意位置。从这个意义上讲，它是按需“动态”加载的，而不仅仅是在模块的开头。
动态import() 语句可用于将 ESM 模块加载到 CommonJS 模块中。常规 import 语句根本不能在 CommonJS 模块中使用。

模块，即使是动态加载的模块也会被缓存。加载后，使用相同文件名的后续 import() 语句只会从缓存中加载模块，而不会 re-read 文件。这就是为什么您的后续 import() 没有选择修改后的 JSON.

如果你想 re-read 文件，那么不要使用 import - 使用类似 fs.promises.readFile() 的东西，然后解析 JSON。这将在您每次调用时读取数据的新副本。

ts 中的 import() 不是动态的？什么原因？

import() in ts is not dynamic? what's the cause?

javascript

import

node-modules

typescript

es6-modules