简介
通过设置模板仓库,您可以帮助人们在 GitHub Codespaces 中开始使用您的框架、库或其他项目。用户可以立即在基于云的开发环境中开始使用您的模板文件,而无需担心克隆您的仓库或安装工具或其他依赖项。通过一些配置,您可以使用已打开的重要文件在 Codespace 中设置用户,并在 VS Code 网页编辑器中预先运行的应用程序的预览浏览器选项卡中进行设置。
任何拥有您模板仓库读取权限的人都可以从 GitHub 上的仓库页面创建 Codespace。您可以将任何现有仓库变成模板,并且您无需更改任何设置即可允许用户从您的模板仓库创建 Codespace。有关将仓库转换为模板的更多信息,请参阅“创建模板仓库”。
为了帮助用户找到您的模板并快速入门,您可以共享指向模板的 Codespace 创建页面的链接。例如,您可以在有关开始使用您的框架的教程中提供此链接。您可以使用“共享深度链接”选项并选择**快速入门**来构建一个链接,该链接将用户带到一个页面,用户可以在该页面上快速创建新的 Codespace 或恢复最近的 Codespace。有关更多信息,请参阅“促进 Codespaces 的快速创建和恢复”。
当有人从您的模板创建 Codespace 时,您的模板仓库的内容将被克隆到他们的 Codespace 中。当用户准备好时,他们将能够将其工作发布到属于其个人帐户的 GitHub 上的新仓库。有关更多信息,请参阅“从模板创建 Codespace”。
组织可以付费让组织成员和外部协作者使用 GitHub Codespaces,费用由组织承担。这包括从组织拥有的模板仓库创建的 Codespaces。但是,如果用户将其从模板创建的 Codespace 发布到其个人帐户,则 Codespace 的所有权和账单将转移到创建 Codespace 的用户。更多信息,请参阅“关于 GitHub Codespaces 的计费”。
描述您的模板
如果您没有,请为您的模板仓库创建一个 README 文件,以描述模板的用途以及如何开始使用它。更多信息,请参阅“关于 README”。
您还可以通过导航到仓库页面并单击页面右侧“关于”部分旁边的按钮来编辑仓库元数据。
添加入门文件
模板仓库通常包含带有样板代码的入门文件,以便用户可以快速开始使用库、框架或其他技术。
有关要包含的文件类型的指导,您可以查看 GitHub Codespaces 官方模板中包含的入门文件,如下所示。
-
在 GitHub 的左上角,选择,然后单击 Codespaces 将带您到 github.com/codespaces 上的“您的 Codespaces”页面。
-
要查看模板的完整列表,请在“探索快速入门模板”部分中单击全部查看。
-
要查看包含模板文件的模板仓库,请单击模板的名称。
配置开发容器
您可以将开发容器配置文件添加到您的模板仓库,以便为使用 GitHub Codespaces 使用您的模板的人员自定义开发环境。您可以从 Visual Studio Code 中预定义的配置设置列表中选择,也可以通过编写自己的devcontainer.json
文件来创建自定义配置。如果您不添加配置文件,将使用默认容器镜像。更多信息,请参阅“开发容器简介”和“将开发容器配置添加到您的仓库”。
注意
当用户从模板仓库中的使用此模板按钮创建 Codespaces 时,他们将无法在配置之间进行选择。Codespace 将基于在.devcontainer/devcontainer.json
中或在您仓库根目录下的.devcontainer.json
中定义的默认配置构建。
您应该使用工具和自定义配置您的开发容器,以便为用户提供最佳的模板体验。例如,在您的devcontainer.json
文件中
- 您可以使用
openFiles
属性定义在从您的模板创建 Codespace 时在 VS Code 网页客户端中自动打开的文件列表。 - 如果用户需要提供个人密钥(例如 API 密钥)才能运行您模板中的应用程序,您可以提示他们提供这些密钥。更多信息,请参阅“指定仓库的推荐密钥”。
- 如果您的模板包含 Web 应用程序的文件,您可以使应用程序在用户的 Codespace 中自动运行。您可以使用
postAttachCommand
属性运行一个脚本,该脚本在 VS Code 网页客户端连接到 Codespace 时立即启动本地服务器上的应用程序,并通过将端口的onAutoForward
属性设置为openPreview
来在 VS Code 网页客户端中嵌入的简单浏览器中显示在该端口上运行的应用程序。
以下 React 模板的配置设置将在用户的编辑器中打开app.js
文件,运行npm start
(在package.json
文件中定义)以启动本地服务器,并将端口3000
转发到 Codespace 中的预览浏览器选项卡。
{
"postAttachCommand": {
"server": "npm start"
},
"portsAttributes": {
"3000": {
"label": "Application",
"onAutoForward": "openPreview"
}
},
"customizations": {
"codespaces": {
"openFiles": ["src/App.js"]
}
}
}
更多信息,请参阅“自动在仓库的 Codespaces 中打开文件”以及 Development Containers 网站上的开发容器规范。