web-upload

静的サイト

• アップテスト
• 環境
  • vue –version: @vue/cli 4.5.13
  • パッケージマネージャー: Yarn

公開するまで

• vue/cli2以前と、3以降でビルド時のconfigファイルの記述方法が違うので注意

公開できるようにビルドする

1. buildで使用するフォルダを変更する
   1. プロジェクトディレクトリ(以下、root)直下にdistフォルダがあれば、docsに変更する（github pagesのデフォルトがdocsのため）
   2. root直下に、vue.config.jsファイルを作成し、以下を記述

       module.exports = {
      outputDir: 'docs',
      assetsDir: './',
      publicPath: './'
       }
      

      上だと、VueRouterを入れるとうまくいかなかった。このサイトを参考に、次のように変更（web-uploadのところは自分のリポジトリ名）

       module.exports = {
      outputDir: 'docs',
      assetsDir: './',
      publicPath: '/web-upload'
       }
      

2. buildする
   1. yarn build

GitHub側の設定

1. githubにpushする
2. GitHub Pagesに登録
   1. リポジトリの、settings => Pagesを開く
   2. Sourceの部分を、master, docsにする
3. https://ユーザー名.github.io/プロジェクト名/index.htmlでアクセスする

やりたいこと

• GitHub Pageにデータを保存できる？
  • GitHub Pageは静的コンテンツしか無理だから、Firebaseなどを使えばできる
  • GitHubをDBのようにして（？）、データを保存
    • 参考にしたい記事

個人的使い方メモ

• このフォルダはコンテナで作成せなあかんため、コンテナ内でyarn buildした後、gitで管理しているフォルダにコピーしてpushし直す