ダーク/ライト切り替え

【超備忘録】Vite+Reactのプロジェクトをサブディレクトリ下にデプロイする方法【超初心者】

投稿日2024-02-11

Picture of the logo


目次

目次を読み込み中...

# はじめに

タイトルどおりVite+Reactのウェブサイトをサブディレクトリ下にデプロイする方法です。毎度忘れそうなので超個人的な備忘録です。興味がある人がいるかもしれないのでブログ化しておきます。

自分のサイトですがこのサイトのようにサブディレクトリ以下にトップページを配置したい時の手順です。

# 1 前提条件

  • ・ vite
  • ・ react
  • ・ typescript

上記の設定でプロジェクト作成。主の開発環境はWindowsですがMacでも変わらないと思います。

# 2 TL;DR

プロジェクトのルートディレクトリにあるvite.config.tsのファイルの中にあるdefineConfigの中にbase:'/サブディレクトリ名'という行を追記する。あるいは既に記載があればurlのサブディレクトリ名にしたい文字列に変更する。

たったこれだけですが、これをしないとjsやcssファイルなどの参照先がバグるので初めての時は躓いたので書き残しておきます。






関連記事

Django Rest FrameworkでTaggitによるフィルタリングを最速で実装する

blog

このブログサイトにも利用しています。Django Restに特化した解説が見つからなかったので備忘録も兼ねて書き残しておきます。

Unityでモザイク処理をする方法

blog

今回はUnityで画像にモザイク処理を掛ける方法を紹介します。標準機能では用意されていないようなのでカスタムシェーダーで実装します。

UnityでSNSシェアボタンを実装してみた(NativeShare)【Unity6対応】

blog

UnityアプリにSNSシェアボタンを手軽に実装する事が出来るアセット[NativeShare](https://github.com/yasirkula/UnityNativeShare)を最新のUnity6に実装して、実際にandroid実機で動かすまでの手順を備忘録も兼ねて書き残しておこうと思います。X(旧Twitter)などへのシェア機能を実装してみたい方は参考にしてみてください。

FirebaseStorageからUnityへファイルを読み込み、Resourcesに保存する

blog

UnityでFIREBASEのStorageサービスから画像ファイルをダウンロードしてシーン上に表示、保存するまでの簡単な手順紹介です。

【Python】最強のパスワードの作り方わかったw【超初心者向け】

blog

pythonの標準モジュールでUUIDというモジュールを使うと簡単に強度な乱数を生成できます。32桁の16進数とそれを4つの-(ハイフン)で区切られた合計36文字の文字列をランダムで生成します。これだけで2^128とおりのパターンがあるので一意の固有の識別番号と言っても過言ではないでしょう。今回はそれを2つ並べます。

UnityでFirebase Storeからデータを読み書きする

blog

FirebaseのFireStoreのデータをUnityから読み書きする手順を紹介します。入門レベル。

【備忘録】2023年版Djangoのstatic保存先をAWS S3にする

blog

Djangoの静的ファイルをS3に保存する手順。2023年1月にAWSに仕様変更が入り、追加の手続きが必要になったので、個人的備忘録を兼ねて書き残しておきます。

Unityで端末情報、IPアドレスを取得する方法

blog

Unityにて端末固有情報などをC#コードから取得する方法をまとめました。

UnityでTrail Rendererを使ってオブジェクトの軌跡を描画する

blog

今回はUnityでTrail Rendererを使ってオブジェクトの軌跡を描画する方法についてご紹介します。Trail Rendererを使うことで、オブジェクトがどのような軌跡を描いたかを可視化することができます。

Django Restを使って管理しているブログにアクセスカウンタを秒で設置する【初心者】

blog

ブログのバックエンドにDjango Restを使い、ページビューのたびに1ずつ増えるカウンタを作る方法を備忘録も兼ねて書き残しておきます。


スポンサーリンク

このサイトをシェアする