Heroku CLIでメモリ量を抑えたい

前提

アプリケーションを開発済み ※今回はフロントエンドをReact+TypeScript，バックエンドをNode.jsで実装
Herokuのアカウントを作成し，ログイン済み
ビルドファイルを作成済み yarn build

問題点

特にmaterial-uiなどのパッケージをheroku側でbuildしたとき，メモリの容量を大幅に超えてしまった．

補足

dynoのBasicを使用しているため最大メモリ量は512MB．しかし以下の図の左側のように大幅に超えてしまいました．そこで，先にbuildを行ってからHerokuにpushすることで右側のようにメモリ量を抑えることができました．

手順

まず，サーバを立てるためのコマンド実行．npmを使用している方は変更してください．

yarn add serve

serve -s build // serveが正常に動作するか，ローカルで確認したいときはこのコマンド

※serveインストール時，globalを追加してしまうとうまく動作しなかった

さらに，package.jsonのscriptsを以下に変更

...
  "scripts": {
    "start": "serve -s build"
  },
...

ここまで出来たらHeroku CLIにpushしていく

git add .
git commit -m "first commit"
git push heroku master

logに以下が表示されたら成功

remote: -----> Compressing...
remote:        Done: 〇〇M
remote: -----> Launching...
remote:        Released v24
remote:        https://アプリ名 deployed to Heroku
remote:
remote: Verifying deploy... done.

デプロイの停止/再開コマンド

heroku ps:scale web=0 // 停止
heroku ps:scale web=1 // 再開

ぶち当たったエラー例

その１

問題

package-lock.jsonとyarn.lockが混在している．

-----> Build failed
 !     Two different lockfiles found: package-lock.json and yarn.lock
       Both npm and yarn have created lockfiles for this application,
       but only one can be used to install dependencies. Installing
       dependencies using the wrong package manager can result in missing
       packages or subtle bugs in production.

解決策

今回はyarnを使うためpackage-lock.jsonを消した．

その２

問題

以下のようにリモートリポジトリを指定していない

fatal: 'heroku' does not appear to be a git repository
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

解決策

herokuをリモートリポジトリに追加

heroku git:remote -a アプリ名

その３

問題

buildディレクトリがpushできない

解決策

.gitignoreファイルから/buildを削除