【Nuxt.js】ブログ作成の記録⑨　～Netlifyへのデプロイ～

はじめに

ブログ作成の格闘記です。今回したいことはデプロイのチェックのみです。

【Nuxt.js】ブログ作成の記録⑧　～作り直し&改修～

デプロイ

以下コマンドを入力。

git init # リポジトリを新規に作成
git add . # ファイルを追加
git commit -m"changed title" # コミットする
git remote rm origin # 登録されているリポジトリを削除する
git remote add origin (GitHubのURL) # リモートリポジトリの追加
git push -u origin master # push

githubのリポジトリが更新されたタイミングで自動的にNetlifyも更新される模様。便利すぎてビックリ。

Netlifyではgithub垢でログイン、リポジトリを紐づけて以下の設定をする。

コマンド：npm run generate
ファイルの指定先：dist

✅アプリ名変更

アプリ作った当初の名前がblog3だったのでダサすぎて変更しました。笑

アプリ名はpackage.jsonのnameを変更すればできました。簡単。

タイトル自体はこちらではなくnuxt.config.jsを変更する必要があるとのこと。　参考

初期

  head: {
    titleTemplate: '%s - ' + process.env.npm_package_name,
    title: process.env.npm_package_name || '',

変更後

  head: {
    title: 'chobilog',

とりあえずこんな感じで。

ついでにfavicon.icoも差し替えたんだけど変わらなかった。。。参考

    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/chobi.png' }
    ]

なぜだろう。一旦ステイ。

とりあえずデプロイはできました。

完成品はこちら

今後すること

・GitHubの学習

・アイコンの修正

・記事追加して改良していく

追記：再デプロイ

ファイル変更があればGitHubにpushしたタイミングでNetlifyも更新される。

ファイル変更がなく、Contentful上で投稿のみ行った場合はNetlify上のデプロイで再度トリガーを引けばサイトが更新される。

✅GitHubの別垢でデプロイ

参考記事：git push で403 error が出た時の対処法

通常の方法でデプロイ

git init # リポジトリを新規に作成
git add . # ファイルを追加
git commit -m"changed title" # コミットする
git remote rm origin # 登録されているリポジトリを削除する
git remote add origin (GitHubのURL) # リモートリポジトリの追加
git push -u origin master # push

アクセス権エラー

The requested URL returned error: 403

アカウントを変えてアクセスする。

git remote set-url origin https://垢名@github.com/垢名/リポジトリ名
git remote -v //これで確認
git push origin master // NG

ユーザー登録

git config --global user.name "hogehoge"
git config --global user.email hogehoge@example.com
ssh-keygen -t rsa // 念のため再登録

鍵の登録

ssh-keygen -t rsa -C mail@mail.com // その後3回エンター