Reactアプリ公開方法

gh-pageのインストール

ターミナルから

npm install gh-pages --save-dev

package.json の scripts に下記の行を追加する

"scripts": { 
  "deploy": "npm run build && gh-pages -d build"
},

homepage を追記する

{
  “homepage”: “http://アカウント名.github.io/リポジトリ名”,
  ”name”: “react-app”,
  ”version”: “0.1.0”,

例)アカウント名 taro  リポジトリ名 sample の時
“homepage”: “http://taro.github.io/sample/”,

cross-env の設定

ターミナルから

npm install cross-env --save-dev

pakage.json の scripts の build を変更する

"scripts": {
  "build": "cross-env PUBLIC_URL=/<リポジトリ名> react-scripts build",
},

例)レポジトリ名が sample の時
"build": "cross-env PUBLIC_URL=/sample react-scripts build",

デプロイ

ターミナルから

git remote add origin https://github.com/<アカウント名>/<レポジトリ名>.git
npm run deploy

例)アカウント名 taro  リポジトリ名 sample の時
git remote add origin https://github.com/taro/sample.git


この記事が気に入ったらサポートをしてみませんか?