npm包 @graphql-tools/graphql-tag-pluck 使用教程

本文介绍npm包 @graphql-tools/graphql-tag-pluck 的使用教程。

简介

@graphql-tools/graphql-tag-pluck 是一个可以从GraphQL标记中提取查询和变量,生成GraphQL请求对象的工具。它常用于将前端代码与后端GraphQL API进行衔接。

安装

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

用法

  1. 编写GraphQL标记文件(.graphql或.gql后缀名)。
----- ------------ ---- -
  -------- ---- -
    --
    ----
    -----
  -
-
  1. 在JavaScript文件中引入 @graphql-tools/graphql-tag-pluck 包。
----- -------- - --------------------------------------------
  1. 将GraphQL标记解析为一个对象。
----- ------- - ---------
  --------------------------------- -- ----
  - ---------------- ---- -- -- ----
--
  1. 使用解析出的对象构建GraphQL请求。
----- - ------------ - - --------------
----- - ------- - - ----------------
----- - ------------- - - ---------------------------

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

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

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

选项

@graphql-tools/graphql-tag-pluck 包支持以下选项:

  • skipIndentation (可选):是否跳过缩进,默认为false

示例代码

  1. index.js
-- --------

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

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

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

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

------
  --------------- ----------
  ---------- -- ------------------
  ---------- -- --------------------
  1. user-query.graphql
- ------------------

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

总结

@graphql-tools/graphql-tag-pluck 是一个非常实用的npm包,可以大大简化前端与后端API的连通性。在实际开发中,可以结合GraphQL、React等库框架,进一步提高开发效率。

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


猜你喜欢

  • npm 包 @lerna/symlink-binary 使用教程

    在前端项目中,我们经常需要使用多个 npm 包。但是,在开发过程中,我们可能会遇到一个问题:如何将不同的 npm 包联接到一起,使它们能够共同使用?这时,npm 包 @lerna/symlink-bi...

    4 年前
  • npm 包 @lerna/symlink-dependencies 使用教程

    在前端开发中,我们经常会涉及到项目中使用多个 npm 包的场景。在这种情况下,若我们需要更改其中一个 npm 包内的代码,通常需要进行多次的手动安装和链接操作。这不仅繁琐,而且容易出错。

    4 年前
  • npm 包 @lerna/link 使用教程

    在现代前端开发中,项目经常会被拆分成多个包并且需要统一管理,一种常见的技术就是使用 Lerna 工具。@lerna/link 是 Lerna 的一部分,它的作用是将 Lerna 仓库的依赖关系指向本地...

    4 年前
  • npm 包 @lerna/listable 使用教程

    简介 @lerna/listable 是一个用于过滤和排序项目模块的 npm 包。它基于 lerna,并提供了一种简便的方式来列出本地已发布的模块。 安装 使用下面的命令,可以通过 npm 安装 @l...

    4 年前
  • npm 包 @lerna/list 使用教程

    npm 是一个非常流行的 JavaScript 包管理器,能够帮助前端工程师快速下载、管理和分享各种 JavaScript 工具,包括库、框架和自己编写的代码。在使用 npm 进行前端项目开发时,一个...

    4 年前
  • npm 包 @lerna/log-packed 使用教程

    本文介绍了 npm 包 @lerna/log-packed 的使用方法和实例。 概述 在前端开发中,我们常常需要管理多个项目的依赖关系。此时,一个叫做 Lerna 的工具就变得非常重要,它可以帮助...

    4 年前
  • npm 包 @lerna/npm-dist-tag 使用教程

    1. 前言 随着前端项目的复杂度越来越高,我们需要管理越来越多的依赖关系。在这个过程中,我们需要使用 npm 来安装和管理包。然而,如果需要同时管理多个 npm 包,就需要使用 @lerna/npm-...

    4 年前
  • npm 包 @lerna/npm-publish 使用教程

    如果你是前端程序员并且在进行多模块项目的开发,那么你一定会遇到一个问题:如何将这些模块打包并且发布到 npm 上。而 @lerna/npm-publish 工具便是一个用于解决这类问题的 npm 包,...

    4 年前
  • npm 包 @lerna/otplease 使用教程

    前端开发中,项目的代码组织和维护是一个重要的问题。特别是对于大型项目而言,我们需要组织多个模块并在不同的代码库之间进行共享和依赖管理。@lerna/otplease 就是一个优秀的 npm 包,用于管...

    4 年前
  • npm 包 @lerna/get-packed 使用教程

    什么是 @lerna/get-packed? @lerna/get-packed 是一个 Node.js 工具,它可以帮助我们在 Lerna 项目中获取打包好的软件包。

    4 年前
  • npm 包 @lerna/pack-directory 使用教程

    背景介绍 随着前端项目的复杂度不断增加,前端项目管理变得越来越重要。多个 npm 包之间的相互依赖和版本管理是前端项目管理的主要难点之一。Lerna 是一个工具,可以帮助我们在单个 npm 仓库中管理...

    4 年前
  • npm 包 @lerna/pulse-till-done 使用教程

    背景 在使用 npm 包时,我们通常会遇到需要等待异步代码完成后再继续执行下一步的情况。这时,我们可以使用 @lerna/pulse-till-done 包来监听异步操作的完成情况,以便进行下一步操作...

    4 年前
  • npm 包 @lerna/publish 使用教程

    在前端开发的过程中,我们通常需要将项目分成不同的模块进行开发和维护。当这些模块需要发布到 npm 上时,我们就需要使用 lerna 来帮助我们完成自动化管理。@lerna/publish 是 lern...

    4 年前
  • npm 包 @lerna/filter-packages 使用教程

    在前端开发过程中,我们经常使用到一些 npm 包来管理我们的项目。@lerna/filter-packages 是一个非常有用的 npm 包,它可以让我们更轻松、快速地对我们的项目进行过滤处理。

    4 年前
  • npm 包@lerna/filter-options 使用教程

    什么是@lerna/filter-options? @lerna/filter-options 是一款用于处理 Lerna 仓库筛选器选项的 npm 包。Lerna 是一个用于管理使用 git 和 n...

    4 年前
  • npm 包 @lerna/get-npm-exec-opts 使用教程

    在前端开发过程中,我们常常需要使用到 npm 包来管理我们的代码和依赖,而 @lerna/get-npm-exec-opts 则是一款可用来获取 npm 命令执行选项的 npm 包。

    4 年前
  • npm 包 @lerna/npm-run-script 使用教程

    在 web 前端开发中,我们经常使用 npm 包管理工具来管理项目所需的各种依赖和模块,随着项目规模的不断扩大,一个项目往往包含有多个子项目,每个子项目又可能包含多个模块,因此项目的管理就变得异常繁琐...

    4 年前
  • npm 包 @lerna/profiler 使用教程

    什么是 @lerna/profiler @lerna/profiler 是一个 npm 包,用于测量和分析您的 Lerna 子项目之间的依赖关系以及资源消耗。它可以帮助您识别性能瓶颈和提高您的项目的整...

    4 年前
  • npm 包 @lerna/timer 使用教程

    什么是 @lerna/timer @lerna/timer 是一个基于 Lerna 的 npm 包,它提供了一个高分辨率计时器,用于测量代码的性能和优化编写的代码。

    4 年前
  • npm包@lerna/run使用教程

    在前端开发中,我们经常需要同时维护多个相关的npm包,而lerna则是一个可以帮助我们更有效地维护多个包的工具。此外,lerna还提供了一个重要的命令——@lerna/run,它是一个非常有用的命令,...

    4 年前

相关推荐

    暂无文章