npm 包 ethdeploy-raw-environment-loader 使用教程

简介

ethdeploy-raw-environment-loader 是一个基于 Node.js 平台的 npm 包,它的主要作用是在前端项目中加载以太坊的合约数据,让前端项目可以直接连接以太坊区块链,从而实现区块链应用的开发。

安装

在项目根目录执行以下命令进行安装:

--- ------- -------------------------------- ----------

使用

在 webpack 配置文件中进行配置:

-------------- - -
  ------- -
    ------ -
      -
        ----- ---------
        ---- -
          -
            ------- -----------------------------------
          --
        --
      --
    --
  --
--

这样就可以将以 .abi 结尾的文件视为以太坊的合约 ABI 数据进行处理,并加载到前端项目中。

实例

以一个简单的投票应用为例,演示如何通过 ethdeploy-raw-environment-loader 包加载合约数据。

首先,在 Solidity 中定义一个投票合约:

------ -------- -------

-------- ------ -
  --------------- -- -------- ------ ------

  -------- ------------ ------------ ------ -
    ---------------------
  -
-

使用 solc 编译器将合约编译为二进制 ABI 数据:

- ---- ----- ----- ---------- -- ------

打开生成的 ABI 文件可以看到以下内容:

-
  -
    --------- ---
    ------- -------
    ---------- ---
    ------------------ -------------
    ------- ----------
  --
  -
    ------------ ------
    --------- -
      -
        ---------- ------
        ------- --------------
        ------- ---------
      -
    --
    ------- --------
    ------- -------
  --
  -
    ----------- -----
    --------- -
      -
        ------- ---
        ------- ---------
      -
    --
    ------- --------
    ---------- -
      -
        ------- ---
        ------- ---------
      -
    --
    ---------- ------
    ------------------ -------
    ------- ----------
  -
-

在前端项目中创建一个 contracts 文件夹,将生成的 ABI 文件以 .abi 结尾的文件名存放在该文件夹下:

--- ---
-   --- ---------
-       --- ----------
--- -----------------

webpack 配置文件中进行配置:

-------------- - -
  ------- -
    ------ -
      -
        ----- ---------
        ---- -
          -
            ------- -----------------------------------
          --
        --
      --
    --
  --
--

在前端代码中加载合约数据:

------ --------- ---- -------------------------

----- --- - ----------------------
----- ---- - --- ------------------------------

----- -------- - --- ---------------------- ----------------------------------------------

-- ----
-------------------------------
  ----- ---------------------------------------------
  ---- -------
  --------- --------------
---------- -- ----------------------

总结

ethdeploy-raw-environment-loader 包可以方便地将以太坊合约数据加载到前端项目中,让前端应用可以与区块链进行交互,进一步扩展了区块链应用的开发可能性。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/6005598e81e8991b448d7254


猜你喜欢

  • npm 包 eslint-config-leomax 使用教程

    介绍 eslint-config-leomax 是一个为了提高前端代码质量而开发的 npm 包。它基于 eslint 程序,提供了一系列的规则规范,可以帮助前端团队在编写和维护代码时更加高效,并且保持...

    2 年前
  • npm 包 vue-native-scrollbar 使用教程

    前言 随着前端技术的不断发展,网页越来越复杂,滚动条成为了一个很重要的组件,可以帮助用户更好地进行内容阅读。但是浏览器原生的滚动条往往不能满足我们的需求,需要使用第三方插件来实现更加自定义化的效果。

    2 年前
  • npm 包 allex_userservercorelib 使用教程

    简介 allex_userservercorelib 是一个 npm 包(Node.js Package Manager 包),它是一个用于实现用户登录注册等功能的后端解决方案的核心库。

    2 年前
  • npm 包 homebridge-pi-lm75 使用教程

    前言 Homebridge 是一个开源的 Node.js 应用程序,它允许您将 iOS 设备变成 HomeKit 配件,并与 Siri 进行通信。而 homebridge-pi-lm75 则是一个可以...

    2 年前
  • npm 包 ngx-karma 使用教程

    前言 在前端开发中,测试是一个非常重要的环节。而 Karma 是一个非常好用的测试运行器,让我们可以通过配置文件在不同的浏览器中运行测试用例。ngx-karma 是一个 Karma 的插件,用于测试 ...

    2 年前
  • npm 包 webpack-processor-notifier 使用教程

    近年来,前端技术飞速发展,众多工具和框架也随之涌现,其中 webpack 作为前端构建工具备受欢迎。而在使用 webpack 进行开发时,我们经常需要运行预处理器以处理 js、css 等文件。

    2 年前
  • NPM 包 fast-license 使用教程

    在开发中,使用外部的 npm 包可以快速提高开发效率,为我们的项目加速进程。然而,我们需要了解这些包所遵守的开源协议,以遵循规定并避免法律纠纷。这时,我们就需要来介绍一个 NPM 包——fast-li...

    2 年前
  • npm 包 itemment 使用教程

    简介 itemment 是一个基于 React 的 Web 组件,它提供了基本的列表展示、分页以及评论功能。 在使用 itemment 之前,我们需要先了解 React、npm、Webpack 的相关...

    2 年前
  • npm 包 react-browser-hack 使用教程

    在前端开发中,我们经常需要在不同的浏览器中测试和优化我们的应用程序。但是,不同的浏览器有不同的兼容性问题,例如 Internet Explorer 和 Edge 等旧版浏览器。

    2 年前
  • npm 包 xiaofang 使用教程

    前言 现今,前端开发是一项非常热门的技能,很多开发者喜欢使用各种各样的前端库或者框架来提高工作效率。而 npm 包成为了高效多用的资源之一。本篇文章将会介绍一个 npm 包 xiaofang,如何安装...

    2 年前
  • npm 包 babel-plugin-constif 使用教程

    简介 babel-plugin-constif 是一个 Babel 插件,可以将 if 语句中的变量声明,转换成 const 声明。这样做有助于更好地保护代码的不可变性,提高代码的可读性。

    2 年前
  • npm 包 tokenstream 使用教程

    在前端开发中,有许多需要使用 token 的场景,比如编译器、代码高亮、代码转换等等。而 tokenstream 是一个方便实现这些功能的 npm 包。本文将为大家介绍 tokenstream 的使用...

    2 年前
  • npm 包 Gona 使用教程

    在前端开发中,有很多需要实现动画效果的场景,如页面加载、用户点击等。为了方便地实现这些动画效果,我们可以使用 Gona 这个 npm 包。本文将详细介绍 Gona 的使用方法,帮助初学者快速上手。

    2 年前
  • npm 包 babel-plugin-ltag 使用教程

    本文介绍了一个名为 babel-plugin-ltag 的 npm 包,它主要用于帮助前端开发者在项目中更方便地使用 Intl MessageFormat 这个工具。

    2 年前
  • npm 包 allex_sessionintroductorservercorelib 使用教程

    前言 在现如今的互联网时代,前端开发已经成为了最热门的技术领域,无论是网站、APP 还是小程序,前端开发都扮演着重要的角色。而随着技术的不断进步和发展,各种新的前端技术和工具层出不穷。

    2 年前
  • npm 包 truly-components 使用教程

    一、简介 npm 包 truly-components 是一款基于 React 的 UI 组件库。它提供了许多常用的 UI 组件,如按钮、表格、文本框等,并且支持主题定制。

    2 年前
  • npm 包 egg-email 使用教程

    简介 Egg.js 是一个基于 Node.js 和 Koa 的企业级框架,提供开箱即用的插件体系,可帮助我们快速构建 Node.js 应用程序。其中 egg-email 是一个基于 nodemaile...

    2 年前
  • npm 包 karma-regex-preprocessor 使用教程

    前言 在开发前端应用时,测试是非常重要的一步。而 Karma 是一个非常好用的测试运行器。在使用 Karma 的过程中,karma-regex-preprocessor 这一 npm 包也许能够帮助你...

    2 年前
  • npm 包 nsg 使用教程

    前言 nsg 是一款基于 Node.js 平台的生成随机数据的工具,可以模拟出在前后端交互过程中所需要的各种数据类型。本文将介绍如何在前端项目中使用 nsg。 步骤 1. 安装 nsg 在终端运行以下...

    2 年前
  • npm 包 wsoop 使用教程

    前言 wsoop 是一个轻量级的前端开发工具库,提供了许多有用的函数和工具,可以帮助开发者更快速地构建 Web 应用程序。本文将展示如何安装和使用 wsoop。 安装 你可以使用 npm 安装 wso...

    2 年前

相关推荐

    暂无文章