英文:
Remix.run and Nivo charts
问题
我在使用 Remix.run 时遇到了问题，无法编译，出现了以下错误：
Error [ERR_REQUIRE_ESM]: 在 C:\Users\tomer\Code\remix-es\node_modules\@nivo\colors\dist\nivo-colors.cjs.js 中，尝试使用 require() 导入 ES 模块 C:\Users\tomer\Code\remix-es\node_modules\d3-color\src\index.js，这不受支持。
请将 C:\Users\tomer\Code\remix-es\node_modules\@nivo\colors\dist\nivo-colors.cjs.js 中对 index.js 的 require 更改为动态 import()，这在所有 CommonJS 模块中都可用。
根据这个链接：link，我需要将包添加到 serverDependenciesToBundle 中。以下是 remix.config.js 的一部分代码示例：
module.exports = {
tailwind: true,
ignoredRouteFiles: ["**/.*"],
serverDependenciesToBundle: ["d3-color", "d3", "@nivo"],
请问这里有什么问题...
英文:
I have a problem using Nivo charts with remix.run. Can't compile, error:
Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users\tomer\Code\remix-es\node_modules\d3-color\src\index.js from C:\Users\tomer\Code\remix-es\node_modules\@nivo\colors\dist\nivo-colors.cjs.js not supported.
Instead change the require of index.js in C:\Users\tomer\Code\remix-es\node_modules\@nivo\colors\dist\nivo-colors.cjs.js to a dynamic import() which is available in all CommonJS modules.
Well according to this: link, I have to add packages to serverDependenciesToBundle. Here is snippet from remix.config.js:
module.exports = {
tailwind: true,
ignoredRouteFiles: ["**/.*"],
serverDependenciesToBundle: ["d3-color", "d3", "@nivo"],
What is wrong here...
答案1
得分: 1
以下是翻译好的部分：
我有一个工具，它会返回要添加到serverDependenciesToBundle的ESM包列表。
https://github.com/kiliman/rmx-cli#-get-esm-packages
npx rmx-cli get-esm-packages @nivo/core @nivo/bar
返回
🔨 将以下依赖项添加到您的serverDependenciesToBundle中
"@nivo/annotations",
"@nivo/axes",
"@nivo/bar",
"@nivo/colors",
"@nivo/core",
"@nivo/legends",
"@nivo/recompose",
"@nivo/scales",
"@nivo/tooltip",
"@react-spring/animated",
"@react-spring/core",
"@react-spring/shared",
"@react-spring/types",
"@react-spring/web",
"d3-array",
"d3-color",
"d3-format",
"d3-interpolate",
"d3-path",
"d3-scale",
"d3-scale-chromatic",
"d3-shape",
"d3-time",
"d3-time-format",
"internmap",
"react-lifecycles-compat"
您还可以使用正则表达式进行简化：
[ /@nivo\/.+/, /d3-.+/ ]
英文:
I have a tool that will return the list of ESM packages to add to serverDependenciesToBundle
https://github.com/kiliman/rmx-cli#-get-esm-packages
npx rmx-cli get-esm-packages @nivo/core @nivo/bar
Returns
🔨 Add the following dependencies to your serverDependenciesToBundle
"@nivo/annotations",
"@nivo/axes",
"@nivo/bar",
"@nivo/colors",
"@nivo/core",
"@nivo/legends",
"@nivo/recompose",
"@nivo/scales",
"@nivo/tooltip",
"@react-spring/animated",
"@react-spring/core",
"@react-spring/shared",
"@react-spring/types",
"@react-spring/web",
"d3-array",
"d3-color",
"d3-format",
"d3-interpolate",
"d3-path",
"d3-scale",
"d3-scale-chromatic",
"d3-shape",
"d3-time",
"d3-time-format",
"internmap",
"react-lifecycles-compat"
You can also simplify by using Regex:
[ /@nivo\/.+/, /d3-.+/ ]
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论