我有一个用Webpack构建的Angular应用程序,它从d3-format
包导入locale JSON文件:
import d3Format from "d3-format/locale/en-US.json";
这在D3 v5中工作得很好。但是在升级到v7之后,我得到了以下错误:
Module not found: Error: Can't resolve 'd3-format/locale/en-US.json'
JSON文件仍然在相同的位置(事实上IDE可以正确解析它)。但是Webpack在构建应用程序时找不到它。破坏此导入的主要更改是d3-format
的package.json
现在包含此位(如果我删除它,构建将再次正常工作!):
"exports": {
".": {
"umd": "./dist/d3-format.min.js",
"default": "./src/index.js"
},
"./locale/*": "./locale/*.json"
}
如果我像这样指定导入路径,导入也可以工作:
import d3Format from "../../../../node_modules/d3-format/locale/en-US.json";
但这很丑陋,我宁愿避免。
1条答案
按热度按时间ffx8fchx1#
在将D3 Js从v6更新到v7之后,在编译我的Angular项目时出现了以下错误:
NodeJs文档中的“exports”键是这样说的:
右侧的所有 * 示例都将被替换为该值,包括它是否包含任何/分隔符。这是一个直接的静态匹配和替换,无需对文件扩展名进行任何特殊处理。
webpack doc说道:
对于以
*
结尾的属性,*
可以采用任何值,并且属性值中的任何*
都将替换为采用的值我的理解是:然后,在Map的 “键侧” 上与
*
匹配的所有内容都被扩展,以代替Map的 “值侧” 中的*
。事实上,从路径中删除扩展名确实满足了解析器,我现在有
require("d3-time-format/locale/en-US")
,我想在使用ESM导入语句时也应该可以工作。注意:NodeJs文档提到了一个Map,其中星号后面是键侧的扩展后缀,说明«在Map的两侧包含“*.js”将暴露的包导出限制为仅JS文件»。例如:
但这似乎不适用于 .json 文件。我试图将d3-time-format的 package.json 中的导出模式转换为
"./locale/*.json": "./locale/*.json"
,并在 require 调用中留下了带有 .json 扩展名的路径,但没有运气,错误«Module not found:错误:包路径./locale/en-US未从包导出...»在编译期间引发。