介绍
在前端开发中，我们经常需要在项目中使用第三方组件或库。而使用 npm 可以方便快捷地获取这些组件或库。在这些组件或库中，有些提供了示例代码供我们参考，但也有一些并没有提供相关的配套文档。在这种情况下，我们可以使用 npm 包 sandbox-react 来进行在线调试和尝试，从而快速理解和学习这些组件或库的使用方式。
安装
在使用 sandbox-react 之前，我们需要先进行安装操作。可以通过如下命令进行安装：
npm install -g sandbox-react
使用
安装完成后，我们可以通过下面的命令来启动 sandbox-react：
sandbox-react
启动后，在浏览器中输入 http://localhost:3000 ，即可看到 sandbox-react 的页面。
接下来，我们需要编写一些示例代码来调试。在这里以 Ant Design 的 Button 组件为例，编写如下代码：
import React from 'react';
import ReactDOM from 'react-dom';
import { Button } from 'antd';
ReactDOM.render(
<Button type="primary">Primary Button</Button>,
document.getElementById('root')
);将上面的代码保存为 index.js 文件，然后在 sandbox-react 中创建一个新的项目，在项目目录下创建一个 src 目录，并将 index.js 文件复制到 src 目录中。
然后，在项目目录下创建一个 package.json 文件，并添加如下代码：
-- -------------------- ---- -------
-
------- ---------------------
---------- --------
------- -----------
--------------- -
------- -----------
-------- ----------
------------ ---------
--
---------- -
-------- ----- --------------------------------------------------------- ------ ------ -------------
-------- -------- ------ -----------
-
-然后，在命令行中输入如下命令进行安装：
npm install
安装完成后，输入如下命令启动项目：
npm start
接下来，在浏览器中打开如下地址，即可看到我们刚刚编写的示例代码已经能够正常运行了。
http://localhost:8080/
总结
通过使用 npm 包 sandbox-react，我们可以通过在线调试和尝试，快速了解并学会使用各种第三方组件和库。在实际开发中，我们可以将这种方法推广到更多的场景中，从而提高我们的开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056c5b81e8991b448e5e58