.htaccessファイルは、Apacheウェブサーバーで使用される設定ファイルです。以下に、Vue.jsの静的ファイルを.htaccessを使用して設定する方法のいくつかの例を示します。
- キャッシュの有効化: .htaccessファイルに次のコードを追加して、静的ファイルのキャッシュを有効化します。
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/html "access plus 1 day"
ExpiresByType text/css "access plus 1 week"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType application/javascript "access plus 1 week"
ExpiresByType application/x-font-ttf "access plus 1 month"
</IfModule>- URLリライト: .htaccessファイルに次のコードを追加して、URLリライトを設定します。これにより、Vue.jsのルーティングに基づいて正しいファイルが表示されます。
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>- 圧縮ファイルの配信: .htaccessファイルに次のコードを追加して、圧縮ファイル（gzipやBrotli）を配信します。
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/css application/javascript
</IfModule>
<IfModule mod_brotli.c>
AddOutputFilterByType BROTLI_COMPRESS text/html text/css application/javascript
</IfModule>これらは一般的な.htaccessの設定例ですが、Vue.jsプロジェクトの要件に合わせてカスタマイズすることもできます。.htaccessファイルは、Vue.jsのビルドディレクトリに配置する必要があります。
以上が、Vue.jsでの静的ファイルの.htaccess設定に関する情報です。ご参考までにお役立てください。