Notes

将 React 项目部署到 GitHub Pages

仅限于静态页面

方法参照 create-react-app 的官方文档

必要条件：react-scripts 版本需在 0.2.0 或以上

假设已经使用过了 create-react-app 创建了 React 项目

配置 package.json

在 package.json 中添加 homepage 字段，与 dependencies 同级，如：

"private": true,
"homepage": "https://xxx.github.io/theApp"

create-react-app 将使用 homepage 值来配置访问页面

安装 gh-pages 并配置发布脚本

安装 gh-pages

npm install -D gh-pages

在 package.json 中添加发布脚本

// ...
"scripts": {
	// ...
	"predeploy": "npm run build",
	"deploy": "gh-pages -d build"
}

predeploy 将会在 deploy 运行前自动运行

发布

运行命令

npm run deploy

确认代码分支

在项目的 settings 的 GitHun Pages 设置部分中，确保源代码 Source 使用的是 gh-pages 分支

到这里，发布配置基本完成，还有其他可选项，如自定义域名。

哦，对了

发布命令完成之后，需要等待一阵子才能生效，立即访问 homepage，很有可能不会得到想要的结果

注意点

可能出现的错误

A branch named 'gh-pages' already exists