如何无错误将含Solidity智能合约的React项目部署到Amazon S3

开发者阿泽

2026-10-1

解决方案

1. 补全构建流程的合约编译步骤

artifacts文件夹是Solidity合约编译后的产物，不会自动生成，你当前的构建脚本只执行了css构建和React打包，没有触发合约编译，且CI环境默认不会拉取你本地生成的artifacts（大概率被你加到了.gitignore忽略列表），直接调整package.json的build脚本，把合约编译命令加到最前面：

若使用Hardhat作为合约开发工具：

"scripts": {
  "build": "npx hardhat compile && npm run build:css && react-scripts build"
}

若使用Truffle作为合约开发工具：

"scripts": {
  "build": "truffle compile && npm run build:css && react-scripts build"
}

同时确认CI构建环境中已安装对应合约开发工具的依赖，避免编译命令执行失败。

2. 兼容Create React App的导入路径限制

Create React App默认只允许导入src目录下的文件，如果你默认把artifacts生成在项目根目录，即使编译成功也会被CRA拦截，二选一解决即可：

方案A：修改合约编译工具的输出路径，直接把artifacts生成到src目录下。以Hardhat为例，在hardhat.config.js中添加如下配置：

module.exports = {
  // 其余原有配置保留
  paths: {
    artifacts: "./src/artifacts"
  }
}

之后同步修改MarketPlace.js中导入MillMarket的路径和配置匹配即可。

方案B：新增自动复制脚本，每次构建时把根目录生成的artifacts复制到src目录下，修改package.json脚本：

"scripts": {
  "copy:artifacts": "cp -r ./artifacts ./src/artifacts",
  "build": "npx hardhat compile && npm run copy:artifacts && npm run build:css && react-scripts build"
}