Vue CLIではプロジェクトをビルドするのにnpm run buildとコマンドを打ちます。
その際、publicフォルダの中身をdistフォルダにコピーしてくれるはずなのですが、public/hoge/index.htmlのようにサブフォルダの中に入っているindex.htmlファイルだけがコピーされませんでした。
手作業でファイルをコピーするのも面倒だし何よりどのファイルが最新か混乱してしまいそうだったので、正しくコピーされるように原因と解決策を調べました。
※ Vue CLIのバージョンは3.2.1を使用しています。
ADs
プロジェクトフォルダの直下にvue.config.jsという名前のファイルを作成します。
既に作成済みの場合は次の手順に進みます。
Vue-cliがpublicからdistにファイルをコピーする処理はcopy-webpack-pluginを使っていますが、その設定を上書きします。
1 2 3 4 5 6 7 8 |
module.exports = { chainWebpack: config => { config.plugin('copy').tap(([options]) => { options[0].ignore = ['./index.html', '.DS_Store'] return [options] }) } } |
\node_modules\@vue\cli-service\lib\config\app.js
の143行目で定義されています。
1 |
const publicCopyIgnore = ['index.html', '.DS_Store'] |
.DS_Storeは分かりますがindex.htmlは「./index.html」のほうが適切なような…?
参考になりました。ありがとうございます。
ADs
コメントはまだありません。