npm 包 "@tdtsh/workshopper" 使用教程

简介

@tdtsh/workshopper 是一个基于 Node.js 的终端教程闯关工具包,可以让你轻松创建交互式的终端教程项目。

使用这个工具包可以帮助你创建更加生动有趣的教程项目,并且可以在终端环境中直接运行,帮助用户更高效的学习和掌握知识。

该工具包具有以下特点:

  • 提供了丰富的 UI 组件,可以用于创建交互式的终端 UI;
  • 提供了丰富的样式配置选项,帮助你快速的创建一个个个性化的教程项目;
  • 支持多语言,可以让你轻松的创建一个支持多语言的教程项目;
  • 完全开源,可以让你自由的扩展和修改它的功能;
  • 支持插件,可以让你轻松的扩展它的功能。

安装

在使用 @tdtsh/workshopper 之前需要先安装它,可以使用 npm 命令进行安装。

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

安装完成后,使用 workshopper 命令就可以进入到教程项目的列表中。

-----------

创建一个教程项目

使用 workshopper create 命令可以创建一个教程项目,执行该命令时,会提示你输入教程项目的名称。

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

该命令会在当前目录下生成一个 my-workshopper 的目录,并且在该目录下会有一个 workshopper.json 文件,用于配置教程项目的信息。

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

其中,name 表示教程项目的名称;title 表示教程项目的标题;description 表示教程项目的描述信息;language 表示教程项目的默认语言;exerciseDir 表示教程项目的练习目录名称;menu 表示教程项目的菜单栏目,可以通过增减菜单项来创建想要的项目结构;repo 表示教程项目的 GitHub 仓库地址,目前还没有支持 GitHub 的功能;styles 表示教程项目界面的样式配置。

接着在教程项目的根目录下创建练习目录 exercises

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

在该目录下创建一个 .md 文件作为教程项目的第一个练习的内容描述。

运行教程项目

在完成教程项目的编辑后,使用 workshopper 命令启动教程项目。

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

然后就可以在终端界面中看到教程项目的运行效果,根据提示一步步的学习和重新执行教程代码,直到成功完成教程。

结语

通过 @tdtsh/workshopper 创建一个交互式的终端教程项目非常方便,不仅能够提供更加生动有趣的学习过程,而且也能够让用户通过直接在终端中进行交互来更好地掌握知识和技能。

如果你正在或即将开始创建一些终端教程项目,建议你尝试一下这个工具包,相信它会让你的教程项目更加生动有趣,用户体验更加良好。

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


猜你喜欢

  • npm包git-head使用教程

    前言 在前端开发中,我们经常需要使用第三方库或者自己封装的组件,为了更好的管理这些代码,我们通常采用npm包管理工具进行打包和发布。而在实际开发中,我们会经常遇到需要获取git仓库的HEAD信息的情况...

    5 年前
  • npm 包 @semantic-release/last-release-npm 使用教程

    在现代的开发中,自动化部署和发布已经成为了必不可少的一部分,而 Semantic Release 就是一个非常流行的自动化版本管理和发布工具。其中,@semantic-release/last-rel...

    5 年前
  • npm 包 @semantic-release/condition-travis 使用教程

    前言 在前端应用开发中,版本发布和自动化构建是必不可少的环节。而在版本发布的过程中,我们可能需要手动操作某些步骤,导致发布过程不够高效和规范化。在这种情况下,语义化版本控制和 travis-ci 可以...

    5 年前
  • npm 包 @octokit/plugin-rest-endpoint-methods 使用教程

    简介 @octokit/plugin-rest-endpoint-methods 是一个 GitHub REST API 的客户端 JavaScript 库。它是 Octokit 的一个插件,提供了多...

    5 年前
  • npm 包 @gr2m/octokit-rest-browser-experimental 使用教程

    简介 随着前端开发日益复杂,人们对于前端的要求也不断提高,以前端为核心的全栈开发已经成为了现在趋势。在前端技术中,有一个很重要的领域就是与后端进行交互。这个时候,我们就需要使用到一些工具,比如:AJA...

    5 年前
  • npm 包 @ctx-core/btoa 使用教程

    在前端开发中,经常需要将一个字符串转换为 base64 编码,这时候就需要用到 @ctx-core/btoa 这个 npm 包了。@ctx-core/btoa 是一个快速的、轻量的 base64 编码...

    5 年前
  • npm 包 @c8y/client 使用教程

    简介 The Cumulocity IoT platform 是一款针对物联网解决方案的平台,开发者可以使用它来构建、部署和管理物联网设备。 c8y-client 是一个由 cumulocity 开发...

    5 年前
  • npm 包 @atlassian/jira 使用教程

    前言 随着当今互联网时代的到来,软件开发变得更加快速和高效。然而,软件开发项目通常更复杂,需要团队成员之间的更好协作和沟通。JIRA 就是帮助解决这些问题的项目管理工具之一。

    5 年前
  • npm 包 @atlassian/bitbucket-server 使用教程

    本文将介绍如何使用 npm 包 @atlassian/bitbucket-server 进行 Bitbucket Server 的操作。Bitbucket Server 是一款 self-hosted...

    5 年前
  • npm 包 @arietrouw/rest 使用教程

    npm 包 @arietrouw/rest 是一个基于 Node.js 开发的 RESTful API 实现模块。它提供了一套简单易用的接口,开发者可以在应用或者服务中快速搭建 RESTful API...

    5 年前
  • npm 包 @pika/plugin-bundle-web 使用教程

    有一款名为 @pika/plugin-bundle-web 的 npm 包,它可以帮助我们将 JavaScript 包打包成小巧且高效的文件,以更快的速度加载网页。

    5 年前
  • npm包@babel/plugin-proposal-export-namespace使用教程

    简介 Babel是一个JavaScript编译器,用于将ECMAScript 2015+代码转换为向后兼容的JavaScript版本。@babel/plugin-proposal-export-nam...

    5 年前
  • npm 包 @babel/plugin-proposal-export-default 使用教程

    简介 @babel/plugin-proposal-export-default 是 babel 的一个插件,可以通过将 export default 语法转换为普通的 export 语法来使用。

    5 年前
  • npm 包 @centarius/state-hoc 使用教程

    在前端开发中,状态管理是非常重要的部分。随着应用程序越来越复杂,状态管理也变得愈发复杂。为了解决这个问题,React 将状态提升到父组件中,然后通过 props 传递给其子组件。

    5 年前
  • npm 包 @centarius/react-loadable 使用教程

    介绍 在现代化的 web 开发中,前端的工作越来越复杂。为了提高网站的性能和用户的体验,前端技术要求越来越高。其中代码的打包和优化是很重要的一环。但是随着应用的复杂程度增加,代码的打包和优化造成的 b...

    5 年前
  • npm 包 @builtbypixel/nucleus-core 使用教程

    在前端开发中,我们常常需要使用各种各样的库和工具来实现功能的实现,这些库和工具能够大大提高我们的工作效率。今天我要介绍一个 npm 包 @builtbypixel/nucleus-core,它是一个轻...

    5 年前
  • npm 包 @enact/cli 使用教程

    在前端开发的过程中,我们经常需要使用到各种各样的工具和库,以提高我们的生产力和代码效率。其中,npm 是一个非常重要的包管理器,而 @enact/cli 又是 npm 中非常重要的一款工具,其可以帮助...

    5 年前
  • npm 包 @babel/plugin-transform-regenerator 使用教程

    介绍 随着前端技术的不断发展,JavaScript 的使用场景越来越广泛,前端工程师们需要掌握更多的技能和工具来应对日益复杂的项目需求和业务场景。@babel 是一个非常受欢迎的 JavaScript...

    5 年前
  • npm 包 @ac-ui/design-system 使用教程

    简介 在前端开发中,UI 设计系统是非常重要的一部分,它可以帮助开发人员快速构建界面并保持一致性。@ac-ui/design-system 是一个基于 React 的 UI 设计系统,提供了一系列样式...

    5 年前
  • npm 包 @a8k/common 使用教程

    随着前端技术的不断发展和更新,我们需要不断地学习和使用新的工具和框架来提高我们的工作效率。其中,npm(Node Package Manager)作为 Node.js 的包管理器,是我们不可或缺的工具...

    5 年前

相关推荐

    暂无文章