npm 包 graphql-start 使用教程

介绍

graphql-start 是一个用于快速搭建 GraphQL 服务的 npm 包。它封装了一个可扩展的 GraphQL 服务框架,并且提供了命令行工具,方便我们快速初始化项目,并自由定制我们的 GraphQL 服务。本文将为大家介绍如何使用 graphql-start 来搭建自己的 GraphQL 服务。

安装

全局安装 graphql-start

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

初始化项目

使用 graphql-start 命令创建项目:

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

比如:

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

这个命令会创建一个名为 my-graphql-app 的目录,里面的内容是一个初始的 GraphQL 服务应用程序。打开 my-graphql-app 目录:

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

我们看到一些目录和文件:

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

其中:

  • node_modules:存放项目依赖的第三方包。
  • package-lock.json:锁定依赖包的版本,以便重复安装。
  • package.json:包含项目的描述信息和依赖。
  • src:存放源代码。

其中,index.js 是应用程序的启动文件,resolvers.js 包含了我们的 GraphQL 查询和修改的逻辑,schema.js 包含了我们的 GraphQL 类型和权限规则,utils.js 是一些公共方法。我们接下来会对这些文件进行说明。

编写 GraphQL 请求

打开 resolvers.js 文件,在里面编写 GraphQL 查询和修改(也叫 mutation)的逻辑。比如,编写一个查询学生的方法 student,在学生数据库中查找对应的学生:

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

这段代码定义了一个 student 方法,它接收一个 id 参数,然后调用 studentAPI.getStudent(id) 方法来查找学生。dataSources 参数是一个包含了所有数据源的对象,我们通过该对象来访问学生数据库。我们后面会说明如何设置数据源。

定义 GraphQL 类型

打开 schema.js 文件,在里面定义 GraphQL 类型和权限规则。比如,定义一个学生类型,它有 idnamescore 三个字段:

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

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

这段代码用 GraphQL Schema Language 定义了一个 Student 类型,它有三个字段,分别是 idnamescoreQuery 类型是 GraphQL 中的一种特殊类型,它定义了可查询的字段。我们在其中定义了一个 student 字段,它接收 id 参数,返回 Student 类型的学生对象。

添加数据源

graphql-start 自带了一些数据源实现,比如 REST 数据源、MongoDB 数据源、PostgreSQL 数据源等。我们可以选择其中一种或多种数据源来实现我们的数据获取逻辑。

以 MongoDB 数据源为例,我们需要首先安装 mongodbgraphql-datasource-mongodb 两个 npm 包:

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

然后,在 utils.js 文件中,添加 MongoDB 数据源:

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

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

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

这段代码定义了 StudentAPI 类,它继承自 MongoDataSource 类。然后,定义了 getStudent 方法,该方法使用 this.findOneById(id) 来查找指定 id 的学生。findOneById 方法是 MongoDataSource 类的方法,它实现了从 MongoDB 中查询数据的逻辑。

最后,我们导出 StudentAPI 类,以便在 resolvers.js 中使用数据源:

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

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

我们在 ApolloServerdataSources() 方法中创建了一个 StudentAPI 实例,将其赋值给 studentAPI 属性。这样,在 resolvers.js 中,我们就可以通过 dataSources.studentAPI 来访问学生 API,并调用 getStudent 方法查询学生。

启动应用程序

编写完整的代码后,我们就可以启动应用程序了。在项目根目录下执行以下命令:

--- -----

这个命令会在 http://localhost:4000/ 启动一个 GraphQL 服务,我们可以在 GraphQL Playground 中进行查询、修改等操作。

示例代码

下面是完整的示例代码,可以放在 resolvers.js 文件中:

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

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

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

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

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

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

下面是完整的示例代码,可以放在 schema.js 文件中:

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

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

结束语

本文为大家介绍了 graphql-start 的使用方法,包括初始化项目、编写 GraphQL 查询和修改、定义 GraphQL 类型和权限规则、添加数据源和启动应用程序等。我们还对每个步骤进行了详细的说明,并给出了示例代码。希望能帮助大家快速上手 GraphQL 开发。

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


猜你喜欢

  • npm 包 sunburst-chart-js 使用教程

    Sunburst-chart-js 是一个基于 JavaScript 的 npm 包,能够通过在网页中绘制出漂亮的 sunburst 图表。Sunburst 图可以让用户更好地理解层次结构和关系,非常...

    3 年前
  • npm 包 fabricjs-pathfinding 使用教程

    在前端开发中,寻路算法很常见。如果要实现一个简单的迷宫游戏,我们必须要使用寻路算法。fabricjs-pathfinding 是基于 fabric.js 的寻路库,可以帮助我们轻松地实现各种寻路算法。

    3 年前
  • npm 包 extract-function 使用教程

    #npm 包 extract-function 使用教程 前言 在前端开发过程中,我们常常需要从现有的代码中提取出某一个函数,以便复用或者进行分模块开发。本文将介绍一款 NPM 包 - extract...

    3 年前
  • npm 包 gitdis 使用教程

    在前端开发过程中,我们经常会使用到各种第三方库和插件来处理一些特殊的需求。而 npm 是前端开发者必不可少的工具之一,可以快速下载并安装各种第三方库和插件。在 npm 的包中,gitdis 是一个非常...

    3 年前
  • npm 包 vue-interval 使用教程

    如果您正在开发一个 Vue.js 应用程序,并且需要在特定时间段内重复执行某个函数或代码,那么您可以使用 npm 包 vue-interval。这个包可以简化您的代码,并让您更容易地管理和控制定时器。

    3 年前
  • npm 包 deep.assign 使用教程

    在前端开发中,我们经常需要对 JavaScript 对象进行合并或复制,以便创建新的对象或更新现有对象。而对于复杂的嵌套对象来说,JavaScript 内置的 Object.assign() 方法可能...

    3 年前
  • npm 包 webpack-configuration-templates 使用教程

    前言 在前端开发中,我们经常需要使用大量的模块,插件和库,而其中很多都需要进行相关配置,比如我们经常用到的 webpack。既然每次需要编写大量的配置代码,为什么不使用一个现成的模板来加快开发进程呢?...

    3 年前
  • npm 包 imghash-turbo 使用教程

    imghash-turbo 是一个快速、简单的 Node.js 模块,用于获取图像的哈希值。本文将详细介绍该 npm 包的使用方法和指导意义。 安装 安装 imghash-turbo 只需在控制台输入...

    3 年前
  • NPM 包 srapi 使用教程

    什么是 srapi? srapi 是一个功能齐全的前端 API 请求库,可以轻松地在你的应用程序中发送 GET、POST、PUT、DELETE 等请求。它支持 Promise 和 async/awai...

    3 年前
  • npm 包 vue-chartjs-nolodash 使用教程

    介绍 vue-chartjs-nolodash 是一个基于 Vue.js 和 Chart.js 的图表组件库,它提供了一组易于使用的图表组件,包括饼图、柱状图、线型图等。

    3 年前
  • npm 包 @0xcda7a/redux-es6 使用教程

    简介 @0xcda7a/redux-es6 是一个基于 Redux 的简单、高效且易于使用的状态容器。它旨在帮助开发者更加轻松地管理应用程序中的状态,提高代码的可维护性。

    3 年前
  • npm 包 cnpm-user-service-gitlab 使用教程

    前言 随着前端技术的不断发展,大量的前端工具和框架被不断地推出。其中 NPM 是前端开发必不可少的工具之一。npm 作为 node.js 包管理器,可以方便的管理和发布各种 JavaScript 库、...

    3 年前
  • npm 包 tymlogger 使用教程

    随着前端技术的不断发展,越来越多的开发者开始学习并使用 npm 包来优化项目。而 tymlogger 就是一个比较常用的 npm 包,它可以帮助我们输出优雅的日志信息,方便调试和排查问题。

    3 年前
  • npm 包 vscode-commands 使用教程

    简介 vscode-commands 是一款方便快捷的 npm 包,它可以让你在 VS Code 的命令面板中轻松查看和执行你的命令。其主要功能是:快速定位和执行你在 VS Code 中的所有命令,一...

    3 年前
  • npm 包 list_requires_multi 使用教程

    在前端开发过程中经常使用到 npm 包,而在项目进行到一定阶段后,我们需要对项目中已经安装的 npm 包进行清理,以减少项目体积和提高运行效率。这时我们就需要使用一个名为 list_requires_...

    3 年前
  • npm 包 fast-cookie 使用教程

    前言 在前端开发中,我们经常会使用 cookie 来记录用户的登录状态以及其他用途。然而,在操作 cookie 时,我们需要进行繁琐的编码和解码,而且还需要考虑 cookie 的过期时间、域名限制等问...

    3 年前
  • npm 包 mysql-json-schema 使用教程

    简介 mysql-json-schema 是一个 npm 包,用于将 MySQL 数据库的架构转换为 JSON 数据格式。它可以帮助开发人员更快捷地了解其数据库的结构,从而更好地进行前端开发。

    3 年前
  • npm 包 @linkiwi/react-window-state 使用教程

    在前端开发中,React 是一种非常流行的编程框架。而在 React 中,我们通常需要管理和维护当用户滚动页面时,窗口的位置以及大小。这时,线上的 npm 包 @linkiwi/react-windo...

    3 年前
  • npm 包 ng-quick 使用教程

    ng-quick 是一个 AngularJS 的快速开发工具集,提供了许多能简化开发流程的指令和组件。 本教程将带领大家了解如何使用 ng-quick 来快速搭建一个视图背景选择器,以及如何在开发过程...

    3 年前
  • npm 包 mongoose-validatorjs 使用教程

    前言 Mongoose 是一款用于操作 MongoDB 数据库的 Node.js 框架,它支持定义数据模型,数据校验,以及增删改查等基本操作。而 mongoose-validatorjs 这个 npm...

    3 年前

相关推荐

    暂无文章