Scaffold-ETH 2 项目教程

Scaffold-ETH 2 项目教程

1. 项目的目录结构及介绍

Scaffold-ETH 2 项目的目录结构如下：

scaffold-eth-2/
├── packages/
│   ├── hardhat/
│   │   ├── contracts/
│   │   ├── deploy/
│   │   ├── test/
│   │   └── hardhat.config.ts
│   ├── nextjs/
│   │   ├── app/
│   │   ├── components/
│   │   ├── hooks/
│   │   ├── pages/
│   │   ├── public/
│   │   ├── styles/
│   │   └── scaffold.config.ts
│   └── ui/
│       ├── components/
│       └── styles/
├── .gitignore
├── .lintstagedrc.js
├── .yarnrc.yml
├── CONTRIBUTING.md
├── LICENSE
├── README.md
├── package.json
└── yarn.lock

目录结构介绍

• packages/: 包含项目的核心代码和配置文件。
  • hardhat/: 包含智能合约相关的文件，如合约代码、部署脚本和测试脚本。
    • contracts/: 存放智能合约的 Solidity 文件。
    • deploy/: 存放合约部署脚本。
    • test/: 存放合约测试脚本。
    • hardhat.config.ts: Hardhat 配置文件，用于配置网络、编译器等。
  • nextjs/: 包含前端应用的代码和配置文件。
    • app/: 存放 Next.js 应用的主要代码。
    • components/: 存放 React 组件。
    • hooks/: 存放自定义 React Hooks。
    • pages/: 存放页面组件。
    • public/: 存放静态资源文件。
    • styles/: 存放样式文件。
    • scaffold.config.ts: 前端应用的配置文件。
  • ui/: 包含 UI 组件和样式文件。
    • components/: 存放 UI 组件。
    • styles/: 存放样式文件。
• .gitignore: Git 忽略文件配置。
• .lintstagedrc.js: Lint-staged 配置文件。
• .yarnrc.yml: Yarn 配置文件。
• CONTRIBUTING.md: 贡献指南。
• LICENSE: 项目许可证。
• README.md: 项目说明文档。
• package.json: 项目依赖和脚本配置。
• yarn.lock: Yarn 锁定文件，用于确保依赖版本一致性。

2. 项目的启动文件介绍

启动文件

• yarn chain: 启动本地 Ethereum 网络。
• yarn deploy: 部署测试智能合约到本地网络。
• yarn start: 启动 Next.js 应用。

启动步骤

1. 启动本地网络:

   yarn chain
   

   该命令使用 Hardhat 启动一个本地 Ethereum 网络，用于测试和开发。

2. 部署测试合约:

   yarn deploy
   

   该命令将测试智能合约部署到本地网络。合约代码位于 packages/hardhat/contracts 目录下。

3. 启动 Next.js 应用:

   yarn start
   

   该命令启动 Next.js 应用，访问地址为 http://localhost:3000。

3. 项目的配置文件介绍

配置文件

• hardhat.config.ts: Hardhat 配置文件，用于配置网络、编译器等。
• scaffold.config.ts: 前端应用的配置文件，用于配置应用的各种参数。

配置文件介绍

hardhat.config.ts

该文件用于配置 Hardhat 网络、编译器和其他相关设置。示例配置如下：

import { HardhatUserConfig } from "hardhat/config";
import "@nomiclabs/hardhat-waffle";

const config: HardhatUserConfig = {
  solidity: "0.8.4",
  networks: {
    hardhat: {
      chainId: 1337,
    },
  },
};

export default config;

scaffold.config.ts

该文件用于配置前端应用的各种参数，如网络配置、合约地址等。示例配置如下：

export const scaffoldConfig = {
  networks: {
    hardhat: {
      url: "http://localhost:8545",
    },
  },
  contracts: {
    YourContract: {
      address: "0x...",
    },
  },
};

通过这些配置文件，开发者可以灵活地配置和调整项目的运行环境和参数。