简介
redoculous
是一个 npm 包,用于在前端应用中生成文档。它可以根据已有的 OpenAPI 或 Swagger 规范生成文档,并支持多种定制化配置。
安装
首先,在终端命令行中使用 npm
命令安装 redoculous:
--- ------- ---------- ------
安装完成后,我们就可以在前端应用中引用它了。
使用
基本用法
在前端应用中使用 redoculous 可以分成两个步骤:
- 导入 npm 包
- 调用 redoculous 并渲染生成的文档
------ ----- ---- ------------ ------ ------------------------- ------------------- --------------------
以上代码中,
Redoc
是从 redoculous 包中导入的,用于调用 redoculous 的接口specUrl
指定了需要根据 OpenAPI 或 Swagger 规范生成文档的规范 URL#redoc-container
是一个 DOM 元素的选择器,指定了文档渲染的容器
如果没有指定 specUrl
,那么 redoculous 会自动查找浏览器当前页面加载的 OpenAPI 规范 URL。
定制化配置
如果需要根据自己的需求定制化文档生成的样式或者内容,可以配置一些 props:
----------------- ----- ----- ----------------------- -- ------------ -------------- --- ------------- ------ ----------------- ----- ----------------- ---- --
以上代码中,
initAsync
方法是异步调用接口,它接受一个包含自定义配置的对象spec
属性指定了需要渲染的规范对象scrollYOffset
属性指定文档滚动时的偏移量hideHostname
属性可以设置为 true,这样在生成的文档中就不会显示主机名nativeScrollbars
属性可以设置为 true,这样就可以使用浏览器的原生滚动条suppressWarnings
属性可以设置为 true,这样 redoculous 在生成文档时就不会显示警告信息了
示例代码
以下是一个完整的示例代码:
--------- ----- ----- ---------- ------ ----- ---------------- ----------------- ------------ ----- ---------------- ------------------------------------------------------- ------- ------ ---- --------------------------- ------- ------------------------------ ------ ----- ---- ------------ ----- ------- - -------------------------------------------- ----------------- ----- ----- ----------------------- -- ------------ -------------- --- ------------- ------ ----------------- ----- ----------------- ---- -- -------------------------------------------- --------- ------- -------
通过这个示例代码,我们就可以在浏览器中看到在 #redoc-container
中根据 specUrl
自动生成的文档了。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/60055cbf81e8991b448da551