// vue.config.js
module.exports = {
    // 已棄用，請使用publicPath
    baseUrl:'/',
    
    // 應用部署在一個域名的根路徑上
    publicPath:'/', // 預設
    // 應用部署在一個域名的子路徑上 https://www.my-app.com/my-app/
    publicPath:'/my-app/',
    // 把開發伺服器架設在根路徑，可以使用一個條件式的值
    publicPath: process.env.NODE_ENV === 'production' ? '/production-sub-path/' : '/',

    // 為生產環境構建檔案的目錄
    outputDir:'dist', // 預設

    // 放置生成的靜態資源 (js、css、img、fonts) 的 (相對於 outputDir 的) 目錄
    // 從生成的資源覆寫 filename 或 chunkFilename 時，assetsDir 會被忽略
    assetsDir:'', // 預設

    // 指定生成的 index.html 的輸出路徑 (相對於 outputDir)。也可以是一個絕對路徑。
    indexPath:'index.html', // 預設

    // 關閉檔名雜湊
    filenameHashing:true, // 預設

    // 在 multi-page 模式下構建應用
    pages:undefined // 預設
    // 每個“page”應該有一個對應的 JavaScript 入口檔案
    pages:{
        index: {
          // page 的入口
          entry: 'src/index/main.js',
          // 模板來源
          template: 'public/index.html',
          // 在 dist/index.html 的輸出
          filename: 'index.html',
          // 當使用 title 選項時，
          // template 中的 title 標籤需要是 <title><%= htmlWebpackPlugin.options.title %></title>
          title: 'Index Page',
          // 在這個頁面中包含的塊，預設情況下會包含
          // 提取出來的通用 chunk 和 vendor chunk。
          chunks: ['chunk-vendors', 'chunk-common', 'index']
        },
        // 當使用只有入口的字串格式時，
        // 模板會被推導為 `public/subpage.html`
        // 並且如果找不到的話，就回退到 `public/index.html`。
        // 輸出檔名會被推導為 `subpage.html`。
        subpage: 'src/subpage/main.js'
    },

    // 是否在開發環境下通過 eslint-loader 在每次儲存時 lint 程式碼。這個值會在 @vue/cli-plugin-eslint 被安裝之後生效。
    // true或'warning：'輸出為編譯警告
    // 'default'：讓 lint 錯誤在開發時直接顯示在瀏覽器中
    // 'error'：把 lint 警告也輸出為編譯錯誤
    lintOnSave:'default', //預設
    // 在生產構建時禁用 eslint-loader
    // 另外檢視devServer設定
    lintOnSave: process.env.NODE_ENV !== 'production',

    // 是否使用包含執行時編譯器的 Vue 構建版本
    runtimeCompiler:false, // 預設

    // 預設情況下 babel-loader 會忽略所有 node_modules 中的檔案。
    //如果想要通過 Babel 顯式轉譯一個依賴，可以在這個選項中列出來。
    transpileDependencies:[] // 預設

    // 生產環境是否需要 source map
    productionSourceMap:true, // 預設

    // 設定生成的 HTML 中 <link rel="stylesheet"> 和 <script> 標籤的 crossorigin 屬性。
    // 該選項僅影響由 html-webpack-plugin 在構建時注入的標籤 - 直接寫在模版 (public/index.html) 中的標籤不受影響。
    crossorigin:undefined, // 預設

    // 在生成的 HTML 中的 <link rel="stylesheet"> 和 <script> 標籤上啟用 Subresource Integrity(SRI)。如果你構建後的檔案是部署在 CDN 上的，啟用該選項可以提供額外的安全性。
    // 需要注意的是該選項僅影響由 html-webpack-plugin 在構建時注入的標籤 - 直接寫在模版 (public/index.html) 中的標籤不受影響。
    integrity:false, //預設

    // 如果這個值是一個物件，則會通過 webpack-merge 合併到最終的配置中。
    // 如果這個值是一個函式，則會接收被解析的配置作為引數。該函式既可以修改配置並不返回任何東西,也可以返回一個被克隆或合併過的配置版本。
    configureWebpack:Object||Function,

    //是一個函式，會接收一個基於 webpack-chain 的 ChainableConfig 例項。允許對內部的 webpack 配置進行更細粒度的修改
    chainWebpack:Function,

    //
    css:{
        // 已棄用，請使用requireModuleExtension
        modules:true,
        //預設情況下，只有 *.module.[ext] 結尾的檔案才會被視作 CSS Modules 模組。設定為 false 後你就可以去掉檔名中的 .module 並將所有的 *.(css|scss|sass|less|styl(us)?) 檔案視為 CSS Modules 模組。
        // 如果你在 css.loaderOptions.css 裡配置了自定義的 CSS Module 選項，則 css.requireModuleExtension 必須被顯式地指定為 true 或者 false，否則我們無法確定你是否希望將這些自定義配置應用到所有 CSS 檔案中。
        requireModuleExtension:true, // 預設
        // 向 CSS 相關的 loader 傳遞選項
        loaderOptions:{}, // 預設
        // 支援的 loader 有 css-loader|postcss-loader|sass-loader|less-loader|stylus-loader 
        // 另外，也可以使用 scss 選項，針對 scss 語法進行單獨配置（區別於 sass 語法）。
        loaderOptions: {
          css: {
            // 這裡的選項會傳遞給 css-loader
          },
          postcss: {
            // 這裡的選項會傳遞給 postcss-loader
          }
        },
        // 是否將元件中的 CSS 提取至一個獨立的 CSS 檔案中
        extract：生產環境下是 true，開發環境下是 false,
        // 是否為 CSS 開啟 source map
        sourceMap:false, //預設
    }

    // 所有 webpack-dev-server 的選項都支援
    devServer:Object,
    // 有些值像 host、port 和 https 可能會被命令列引數覆寫
    // 有些值像 publicPath 和 historyApiFallback 不應該被修改，因為它們需要和開發伺服器的 publicPath 同步以保障正常的工作
    devServer: {
        // 設定讓瀏覽器 overlay 同時顯示警告和錯誤
        overlay: {
            warnings: true,
            errors: true
        },
        // 代理伺服器
        proxy:string | Object,
        proxy: 'http://localhost:4000',
        proxy: {
            '/api': {
                target: '<url>',
                ws: true,
                changeOrigin: true
            },
            '/foo': {
                target: '<other_url>'
            }
        }
    },

    // 是否為 Babel 或 TypeScript 使用 thread-loader。該選項在系統的 CPU 有多於一個核心時自動啟用，僅作用於生產構建
    parallel:require('os').cpus().length > 1, //預設

    // 向 PWA 外掛 傳遞選項
    pwa:Object,

    // 這是一個不進行任何 schema 驗證的物件，因此它可以用來傳遞任何第三方外掛選項
    pluginOptions:Object,
    pluginOptions: {
        foo: {
          // 外掛可以作為 `options.pluginOptions.foo` 訪問這些選項。
        }
    }
}