Antd中示例代码是怎么直接在CodeSandBox中打开的

使用过Antd的小伙伴应该很熟悉，Antd组件文档有在CodeSandBox和CodePen中打开直接预览和编辑的功能，这么炫酷且实用的功能具体是怎么实现的？

codesandbox.io 是一个前端代码的在线编辑器，支持各种不同的框架，可以随时预览代码的运行结果。

创建沙盒

“在CodeSandBox中代开”是CodeSandbox提供的功能，让我们可以通过直接调用API来创建CodeSandbox沙盒。

CodeSandbox提供了几种导入到沙盒中预览的方式：

• 直接使用提供的公共模板

• 从GitHub导入：https://codesandbox.io/s/github

• 使用GitHubBox：将仓库地址中github.com替换为githubbox.com

  • https://github.com/Iamxiaozhu/file-uploader-cli => https://githubbox.com/Iamxiaozhu/file-uploader-cli

• 安装浏览器扩展，打开GitHub，页面中会添加一个“在CodeSandBox中打开”的按钮

• 通过命令行从本地导入：