07.truffle集成react安装以及配置教程

  • Z时代
  • 2024-01-10
  • 分类：综合

react

truffle有很多预置的项目，这些项目大多集成了前端模块，使得我们可以迅速进行二次开发。

那么，我开始记录truffle内置项目react安装的目录

注意：首先你要有node环境，懂了吗？然后你要有truffle环境

1.unbox命令

我们使用unbox命令进行内置模块的下载

2.开始集成react

  • 创建一个新的目录（名字随意起，但是内容必须为空）

  • 切换到目录

  • 执行安装命令

truffle unbox react

下载资源的时间比较久，所以慢慢等待吧。 等的时候可以玩手机

2.检查是否有contracts

因为版本原因，需要检查下 cd client/src，如果没有，则需要处理，window直接复制cond到里面，ios需要

 ln -s ../../build/contracts contracts

3.退回react根目录

执行

truffle develop

记录下助记词

4.修改port映射文件 truffle-config.js

module.exports = {
    networks: {
        development: {
            host: "localhost",
            port: 9545,
            network_id: "*" // 匹配任何network id
        }
    }
};

以实际自己的启动端口为标准

5.compile 编译

  • 是否报错

6.migrate 迁移部署

  • 是否报错

7.启动react

如果上面执行正常，开始启动react服务，切记，是切换到client文件下，不是在根目录中

cd client
npm run start

8.配置metaMask

  • 导入助记词

  • 切换到私有端口

  • 加载数据

  • 测试是否正常

9.其他根据业务需求进行更改

以上是 07.truffle集成react安装以及配置教程 的全部内容， 来源链接： utcz.com/z/381937.html

回到顶部