npm 包 auto-readme 使用教程

如今,前端开发从过去的「给页面加效果」,发展到了对于整个网站的构建和设计。除了 HTML、CSS 和 JavaScript 的基础技术,我们还需要关注 npm 包的使用。而在开发 npm 包时,README.md 文件是展示自己的项目的重要手段之一。因此,如何撰写高质量、易懂、详细的 npm 包 README.md 文档,是非常重要的技能之一。

好在有一个集成了自动生成 README.md 文件的命令行工具 —— auto-readme,可以帮助我们快速而准确地编写 npm 包的文档。

auto-readme 是什么?

auto-readme 是基于代码分析的自动生成文档的 npm 包。它通过读取代码和代码注释来分析项目文件,并生成符合标准的 README.md 文件。

auto-readme 能够准确解析代码中的注释,自动收集项目信息。同时,它还能生成代码演示片段、安装流程、使用方法等详细内容。

使用 auto-readme

  1. 安装 auto-readme
--- ------- -----------
  1. 新建 .autoreadme.js 文件

在项目的根目录下,新建一个名为 .autoreadme.js 的文件,并将以下内容复制到文件中:

-------------- - --
    ------- ----- ------- ------
    ------- ----------
    -------- ----------------
    --------- -
        ---------------------
        -------------
        ---------------
        -----------------
        ------------
        -----------
        -----------
    --
    -------- -----
    -------------- ---
    --------------- ---
    ------------------ --
---
  1. 运行 auto-readme

在终端输入以下命令:

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

运行完毕后,就能在 README.md 文件中看到自动生成的文档了。

auto-readme 配置

auto-readme 配置文件 .autoreadme.js 的配置选项如下:

name

Type: string

NPM 包的名称。

dirs

Type: array

需要扫描的目录。

files

Type: array

需要生成输出内容的文件。

ignore

Type: array

忽略扫描的文件或目录。这里的格式与 .gitignore 文件相似。

badge

Type: boolean|object

自动生成的 README.md 文件中,插入一个 badge,用于显示项目的状态信息。

使用布尔值「true」项时,将生成一个默认的 badge,内容包括 package name、version、downloads 和 Travis CI 状态。

使用对象则可自定义 badge 的样式和内容。

例如:

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

description

Type: string

npm 包简短的描述。会在微调案例和代码演示下方显示。

dependencies

Type: object

npm 包依赖的库。

devDependencies

Type: object

npm 包开发依赖的库。

运行命令生成文档效果

auto-readme 生成的 README.md 文件中,包含有安装流程、构建说明、案例展示、代码演示,以及作者等重要信息。

演示效果如下:

-- --

-- --- ---

-------
--- ------- --------------
  1. 构建说明
  • 此 npm 包依赖库:jquery、react;
  • 可通过 .xxx() 调用其中的方法;
  • 其中的 xxx() 方法用于在页面上展示 xxx 段内容。
  1. 案例展示

以下为一些应用该 npm 包的网站:

  1. 代码演示
------ ------- ---- -----------------

--- ----------------- - --- ----------
-------------------------
  1. 作者

© 2021 your package name licensed under the MIT license.

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

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

猜你喜欢

  • npm 包 ii-store 使用教程

    前言 随着前端技术的不断发展,对业务逻辑和数据状态的管理也越来越重要。而 ii-store 就是一个前端状态管理库,可以帮助我们更好地管理数据状态。 本文将详细介绍 npm 包 ii-store 的使...

    3 年前
  • npm 包 @bdchauvette/gulp-prettier 使用教程

    在前端开发中,我们经常遇到需要美化代码的需求。这时,@bdchauvette/gulp-prettier 就是一个非常优秀的工具。它可以帮助我们自动格式化 JavaScript、JSON、CSS 等文...

    3 年前
  • npm 包 mbtiles-terrain-server 使用教程

    在 WebGIS 开发中,地形数据是非常重要的一种要素。而 mbtiles-terrain-server 是一种非常优秀的 npm 包,它可以帮助前端开发者快速的将 MBTiles 格式的地形数据服务...

    3 年前
  • npm 包 react-bs-components 使用教程

    在前端开发中,我们经常使用组件库来加快我们的开发效率。其中一个强大的组件库就是 react-bs-components,这个组件库提供了许多常用的 Bootstrap 组件,但是是以 React 组件...

    3 年前
  • npm 包 generator-tl-create-component 使用教程

    在前端开发中,我们经常需要创建组件。但每次都手动创建组件的目录、文件、导入导出等等,实在是太繁琐了。这时候,我们可以借助 generator-tl-create-component 这个 npm 包来...

    3 年前
  • npm 包 Clean-Shortid 使用教程

    在前端开发中,有很多情况会需要生成唯一的 ID。然而,JavaScript 提供的内置方法 Math.random() 生成的 ID 并不够短,也不够可控。因此,开发者们通常会使用第三方库来生成短小、...

    3 年前
  • npm 包 homebridge-pir-sensor 使用教程

    前言 在 IoT 应用和智能家居项目中,人体感应传感器(PIR)是一种重要的感知设备。homebridge-pir-sensor 是一个基于 Node.js 语言的开源项目,它提供了一种在 Homeb...

    3 年前
  • npm 包 ember-cli-merge-json 使用教程

    在前端开发中,我们经常需要合并一些 JSON 文件,而手动合并是一项繁琐的任务。为了避免手动合并 JSON 文件,我们需要使用一个工具来自动化这个过程。这时,ember-cli-merge-json ...

    3 年前
  • npm 包 react-gesture-tsx 使用教程

    什么是 react-gesture-tsx? react-gesture-tsx 是一款可以在 React 应用中使用的手势库。它提供了一系列的手势事件,包括 tap、swipe、pinch 等,使用...

    3 年前
  • npm 包 react-heap 使用教程

    在 React 应用程序中添加分析是很重要的。React Heap 就是一个非常实用的 npm 包,它可以帮助你在 React 应用程序中添加分析统计。这个包可以让你在页面上跟踪用户的活动,并对页面性...

    3 年前
  • npm 包 febs-test 使用教程

    在前端开发中,为了保障代码的质量和稳定性,我们经常会使用各种单元测试、集成测试等测试工具来进行各种测试,确保代码的可靠性和稳定性。而本文要介绍的 febs-test 就是一种基于 npm 包的前端测试...

    3 年前
  • npm 包 zhuge-io-node 使用教程

    前言 在前端开发中,我们经常需要进行统计和分析,以便更好的了解用户和优化产品。而诸如神策、友盟等产品可以帮助我们快速实现这些功能。在选定了一个统计分析产品后,我们就需要引入其对应的 SDK,而 zhu...

    3 年前
  • npm 包 dogjun-utils 使用教程

    引言 dogjun-utils 是一个开源的前端工具库,提供了多个常用的前端工具函数,可以帮助前端开发者快速完成常见的功能需求。本文将介绍如何使用 dogjun-utils,以及其中一些重要功能的实现...

    3 年前
  • npm 包 lu__ban 使用教程

    简介 npm 是一个 Node.js 包管理器,它使得开发者可以轻松地安装、更新和管理 Node.js 模块和包。在前端开发中,经常使用 npm 包来扩展代码的功能和依赖项,例如 jQuery、Axi...

    3 年前
  • npm 包 lu_ban 使用教程

    前言 在前端开发中,我们经常需要利用许多第三方库和工具来完成我们的工作。其中,npm 是前端领域中最常用的包管理工具之一。本篇文章将为大家介绍一个实用的 npm 包 lu_ban,并提供详细的使用教程...

    3 年前
  • npm 包 tint.js 使用教程

    简介 tint.js 是一个用于调整图像颜色的 JavaScript 库,借助于该库,我们可以在前端轻松地对图像进行处理。本文将为大家详细介绍 tint.js 的使用方法。

    3 年前
  • npm 包 wiegand 使用教程

    简介 wiegand 是一款可以在前端中读取韦根协议的 npm 包。它帮助我们在前端中实现了韦根协议与硬件设备对接的功能。本文将介绍 wiegand 如何在前端中使用,希望能对初学者有所启示。

    3 年前
  • npm 包 ng-node-compile-gordo 使用教程

    前言 在前端开发中,我们通常会使用 AngularJS 这个开源 JavaScript 框架。对于那些偏爱使用 Node.js 的开发者来说,在开发 AngularJS 应用程序时,一个名为 ng-n...

    3 年前
  • npm包 @gcorreageek/react-excel-workbook使用教程

    前置知识 在使用 @gcorreageek/react-excel-workbook之前,需要对 React框架和 JavaScript语言有一定的了解及熟练掌握。

    3 年前
  • npm 包 wp-barba-page-preloader 使用教程

    在现代 Web 开发中,SPA(Single-Page Application)已经成为相当流行的方案。然而,即便采用了 SPA,依旧需要做一些优化工作来给用户带来更好的交互体验。

    3 年前

相关推荐

    暂无文章