現象
- Nuxt.jsのプロジェクトをGitHub.ioにデプロイすると、下記エラーが発生しました。
Image may be NSFW.
Clik here to view.
- 実際にjsファイルがRepositoryに存在します。
Image may be NSFW.
Clik here to view.
原因推測
- Nuxt.jsのGenerateでのフォルダー
_nuxtがHTTPのcontent-security-policyを行いました。セキュリティーのため、_nuxt/*.jsファイルのアクセスを禁止されました。
Image may be NSFW.
Clik here to view.
修正する方法
nuxt generate後にNode.jsでフォルダーの名を変更します。例えば_nuxt->staticnuxt.config.jsの修正も必要です。
nuxt.config.js
{// Disable server-side rendering (https://go.nuxtjs.dev/ssr-mode)ssr:false,// Target (https://go.nuxtjs.dev/config-target)target:'static',build:{extend(config,{isDev}){if(!isDev){config.output.publicPath='./static/'}},router:{mode:'hash'},}generate
# command
nuxt generate
ビルドされたファイルはdistにあります。
node.jsの処理
// build/index.jsconstfs=require('fs-extra')const{resolve}=require('path')// Rename: _nuxt to staticfs.moveSync(resolve(__dirname,'../dist/_nuxt'),resolve(__dirname,'../dist/static'))// command
node build/index.js
package.json修正
{"scripts":{"build":"nuxt generate && node build/index.js"}}一つのコマンドでソールのビルドと、フォルダー名の変更になります。
// command
npm run build
備考
ソース: https://github.com/capricorncd/blog/tree/master/demos/app-website
Github Pages: https://capricorncd.github.io/blog/dist/app-website/
