在React/JavaScript中如何导入名称以.js结尾的模块？

• 核对并安装正确依赖
  你参考的是bandchain2.js模块，但代码中导入的是bandchain.js，先确认需要使用的包版本，执行对应安装命令：
  如需使用bandchain.js，执行：
  npm install @bandprotocol/bandchain.js
  如需使用bandchain2.js，执行安装命令后修改导入语句为：
  import { Client } from '@bandprotocol/bandchain2.js';

• 安装后仍报错调整导入写法
  如果已经正确安装对应包还是提示找不到模块，原因是打包工具默认会把导入路径末尾的.js识别为文件后缀，而非包名的一部分，直接写全包的入口路径即可解决：

// 对应bandchain.js的写法
import { Client } from '@bandprotocol/bandchain.js/dist/index.js';
// 对应bandchain2.js的写法
import { Client } from '@bandprotocol/bandchain2.js/dist/index.js';

• 配置别名简化导入（可选）
  如果不想每次都写全路径，可以给打包工具配置别名，以webpack为例，在webpack.config.js的resolve.alias字段添加如下配置：

resolve: {
  alias: {
    '@bandprotocol/bandchain.js': require.resolve('@bandprotocol/bandchain.js'),
    // 使用2版本替换为下方配置
    // '@bandprotocol/bandchain2.js': require.resolve('@bandprotocol/bandchain2.js'),
  }
}

如果是未eject的create-react-app项目，可通过craco等扩展工具修改对应配置。

内容的提问来源于stack exchange，提问作者silvercondor