时间戳

首页 > 解决方案 > 为什么 Webpack 延迟加载会加载文件夹中的所有文件？

typescript - 为什么 Webpack 延迟加载会加载文件夹中的所有文件？

问题描述

我正在尝试i18n使用动态导入文件webpack：

function getI18n(lang) {
  return import(/* webpackChunkName "i18n/[request]" */ `./locales/${lang}.json`)
  .then(/*whatever*/)
}

但即使在调用该函数之前，我也可以在开发人员工具中看到该文件夹​​中的所有文件都已加载：

等等。

那不是我想要的。我想在运行时动态延迟加载所需的块。

有趣的是，如果我将重命名文件ru->ru2和nw->nw2并将导入更改为使用编号为 2 的路径，如下所示：./locales/${lang}2.json它将仅加载文件i18n/ru2.json.js并i18n/nw2.json.js忽略名称中没有2字符的那些。所以我猜它是用某种正则表达式而不是完全匹配来操作的。

谢谢

PS老实说，我使用vuejsand typescript，所以问题可能介于两者之间。我一直在尝试使用我的代码遵循这个示例vuei18n 延迟加载。

标签： typescriptvue.jswebpackvuejs2lazy-loading

解决方案

Webpack 不知道您在运行时需要该目录中的哪个文件，因此它需要包含捆绑包中的所有文件。（https://webpack.js.org/guides/dependency-management/#require-with-expression）

推荐阅读