Ant Design Pro

初始化Ant design pro时遇见ERROR code
当根据官网的提示在cmd中输入npm i @ant-design/pro-cli -g，等待下载完成，再输入pro create myapp后，错误出现，
错误代码为
C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\src\create\generators\ant-design-pro\index.js:10
const sortPackage = require('sort-package-json');
                   ^

Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\node_modules\sort-package-json\index.js from C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\src\create\generators\ant-design-pro\index.js not supported.
Instead change the require of C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\node_modules\sort-package-json\index.js in C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\src\create\generators\ant-design-pro\index.js to a dynamic import() which is available in all CommonJS modules.
    at Object. (C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\src\create\generators\ant-design-pro\index.js:10:21)
    at C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\src\create\index.js:15:23
    at new Promise ()
    at runGenerator (C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\src\create\index.js:8:10)
    at run (C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\src\create\index.js:35:12)
    at Object. (C:\Users\User\AppData\Roaming\npm\node_modules\@ant-design\pro-cli\cli.js:60:34) {
  code: 'ERR_REQUIRE_ESM'
}

Node.js v18.12.1
我的npm版本为9.3.1，nodejs版本为18.12.1，yarn版本为1.22.19，这部分应该没有错误，在网上搜索后，问题原因是Import的包被转换成ESM-only，无法使用require()，只能将所有require()改成import()
我想知道有没有其他更好的方案，我看网上的很多教程都是按照manual直接在cmd输入代码就直接成功了，我是在开始配置环境的时候犯什么错了吗?

npm i @ant-design/pro-cli -g
进入@ant-design/pro-cli 目录中
npm i sort-package-json@1.55.0 -D
重新创建项目pro create my-app

望采纳！！！！

你可以尝试降级：node-fetch 2.6.7 CommonJS

npm uninstall node-fetch

npm install node-fetch@2.6.7

看报错的包好像是他脚手架自身的问题。你换个脚手架版本试试。

这个错误是由于Ant Design Pro CLI使用了 CommonJS 的 require() 方式导入 sort-package-json 包，而 sort-package-json 包只支持 ESM 的 import() 方式。

你可以尝试使用以下方法来解决这个问题:

  1. 使用 npm 升级 Ant Design Pro CLI 到最新版本, 因为该问题已经在最新版本中修复.
  1. 在项目中手动安装 sort-package-json 包，并将其从 Ant Design Pro CLI 的 index.js 中引用.
  1. 使用 yarn 来代替 npm 安装 Ant Design Pro CLI.
  1. 将 Node.js 降级到支持的版本.

如果仍然无法解决问题，可以在 Ant Design Pro 的 GitHub 上提交 issue 以获得更多帮助。

望采纳。

您所描述的错误信息指出，您正在尝试使用 require() 加载一个 ECMAScript 模块 (ESM)，但当前环境不支持。

您已经正确地提到了解决方案：将所有 require() 改为 import() 。

您可以在 ant-design/pro-cli 中的源代码中找到所有的 require() 语句，并将它们替换为 import()。

为了确保更新后的代码能够正常工作，您还需要确保您的 Node.js 版本支持 ESM，并且您需要在运行代码之前，在终端中使用 --experimental-modules 标志启用 ESM 支持。

另外，在使用新版本的 ant-design/pro-cli 前最好先清理缓存，重新安装依赖

npm cache clean --force
npm install

或者在使用yarn的情况下

你遇到的问题是由于使用的是 CommonJS 模块，而 sort-package-json 包已经转换为 ESM-only 了，所以无法使用 require() 来加载。

一个解决方案是将所有的 require() 替换为 import()。这样做是因为 import() 是支持 ESM 的，而 require() 不支持。但是这样做可能会有很多工作量。