demoizer 是一个 Node.js 模块，可以将 Node.js 模块转换成可以直接在浏览器中使用的 Demo 示例，并可在页面中实时调试。本文将详细介绍 demoizer 的使用教程，包括安装、使用、参数设置以及示例代码等内容。
安装
通过 npm 的全局安装方式进行安装：
npm install -g demoizer
使用
以下是使用 demoizer 的基本步骤：
步骤一：创建 Demo 源代码文件
在任意目录下新建一个 .js 文件，作为我们的 Demo 源代码文件，例如名称为 my-demo.js。这里以输出 Hello world 为例：
console.log('Hello world!');步骤二：编写示例 HTML 文件
在任意目录下新建一个 .html 文件，作为我们的示例 HTML 文件，例如名称为 my-demo.html，其中需要包含以下代码：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------- ------------
-------
------
------- --------------------------
-------
-------其中 src 属性为我们在步骤一中创建的 Demo 源代码文件。
步骤三：使用 demoizer 进行转换
在终端中进入示例 HTML 文件所在目录，然后执行以下命令：
demoizer my-demo.html
执行成功后，会提示生成的 Demo 文件路径，例如：
Generated demo file: /path/to/my-demo-demo.html
步骤四：在浏览器中打开 Demo 文件
在浏览器中打开步骤三生成的 Demo 文件，可以看到控制台输出了 Hello world。
参数设置
在使用 demoizer 进行转换时，你还可以设置一些参数，以实现更为灵活的操作。以下是 demoizer 支持的参数以及说明：
title: 设置 Demo 页面的标题，默认为 "Demo"。output: 设置生成的 Demo 文件名，默认为原文件名后加上 "-demo" 后缀。inject: 向生成的 Demo 文件中注入额外的代码，例如用来引入依赖库等。script: 指定 Demo 源代码文件路径，如果不指定，则默认使用 HTML 文件中的src属性。
以下是设置参数的示例代码：
demoizer my-demo.html --title "My Demo" --output "my-demo-demo.html" --inject "https://cdn.example.com/library.js" --script "path/to/my-demo.js"
示例代码
下面是使用 demoizer 生成的示例代码：
-- -------------------- ---- ------- --------- ----- ------ ------ ------ ---------------- -------------------- ------- ------ -------- ----------------------------------- ------- -------
通过使用 demoizer，可以让我们更加方便地在浏览器中展示、调试和分享我们的 Demo 示例代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005739481e8991b448e984d