vue-cliでどうやってbuildされるのか(2)


vue.config.jsとは?

vue-cliによって自動的にロードされる構成ファイル
ファイルはオプションを含むオブジェクトをエクスポートする必要がある

// vue.config.js
module.exports = {
  // options...
}

publickPath

タイプ:string
デフォルト:/
アプリケーションがデプロイされるベースURL
webpackの output.publicPath と同等
サブパスにデプロイしたい場合は 指定する必要がある /my-app/

outputDir

タイプ:string
デフォルト:dist
本番ビルドファイルが生成されるディレクトリ
ターゲットディレクトリはビルド前に削除される

assetsDir

タイプ:string
デフォルト: ''
生成された静的アセットを配置するディレクトリ
生成されたアセットからファイル名、chunkFilenameを上書きする場合、assetsDirは無視される

indexPath

タイプ:string
デフォルト:index.html
生成されたindex.htmlのoutputDirに対しての出力パスを指定します

filenameHashing

タイプ:boolean
デフォルト:true
生成された静的アセットのファイル名には、キャッシュ制御を向上させるためのハッシュが含まれている

page

タイプ:Object
デフォルト:undefined
マルチページモードでアプリをビルドします。
各ページには対応するJavaScriptエントリファイルが必要

module.exports = {
  pages: {
    index: {
      // entry for the page
      entry: 'src/index/main.js',
      // the source template
      template: 'public/index.html',
      // output as dist/index.html
      filename: 'index.html',
      // when using title option,
      // template title tag needs to be <title><%= htmlWebpackPlugin.options.title %></title>
      title: 'Index Page',
      // chunks to include on this page, by default includes
      // extracted common chunks and vendor chunks.
      chunks: ['chunk-vendors', 'chunk-common', 'index']
    },
    // when using the entry-only string format,
    // template is inferred to be `public/subpage.html`
    // and falls back to `public/index.html` if not found.
    // Output filename is inferred to be `subpage.html`.
    subpage: 'src/subpage/main.js'
  }
}