// Vue.config.js 配置選項

module.exports = {
    // 選項

    // 基本路徑
    publicPath: "./",

    // 構建時的輸出目錄
    outputDir: "dist",

    // 放置靜態資源的目錄
    assetsDir: "static",

    // html 的輸出路徑
    indexPath: "index.html",

    // 是否開啟檔名雜湊
    filenameHashing: true,

    // 用於多頁配置，預設是 undefined
    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` 進行檢查。有效的值：`ture` | `false` | `"error"`  當設定為 `"error"` 時，檢查出的錯誤會觸發編譯失敗。
    lintOnSave: true,

    //  是否使用帶有瀏覽器內編譯器的完整構建版本，設定為 true 後你就可以在 Vue 元件中使用 template 選項了，但是這會讓應用額外增加 10kb 左右。
    runtimeCompiler: false,

    //  babel-loader 預設會跳過 node_modules 依賴。
    transpileDependencies: [ /* string or regex */ ],

    //  是否為生產環境構建生成 source map
    productionSourceMap: true,

    //  設定生成的 HTML 中 <link rel="stylesheet"> 和 <script> 標籤的 crossorigin 屬性。
    crossorigin: "",

    //  在生成的 HTML 中的 <link rel="stylesheet"> 和 <script> 標籤上啟用 Subresource Integrity (SRI)。
    integrity: false,

    //  調整內部的 webpack 配置
    configureWebpack: () => {}, //(Object | Function)
    chainWebpack: () => {},

    // 配置 webpack-dev-server 行為。
    devServer: {
        open: true,
        host: 'localhost',
        port: 8080,
        https: false,
        hotOnly: false,
        
        // 配置代理伺服器
        proxy: {
        	'/api': {
                target: 'http://ip:port',  // 請求的第三方介面
                secure: false,   //如果是http介面，需要配置該引數
                ws: true,  // proxy websockets，訪問閘道器，使用http的連線方式進行socket資訊推送
                changeOrigin: true,  // 在本地會建立一個虛擬服務端，然後傳送請求的資料，並同時接收請求的資料，這樣服務端和服務端進行資料的互動就不會有跨域問題
                pathRewrite: {  // 路徑重寫，
                    '^/api': ''  // 替換target中的請求地址，也就是說以後你在請求http://ip:port這個地址的時候直接寫成/api即可。
                }
            }
        },

        before: app => {}
    },

    // CSS 相關選項
    css: {

        // 將元件內的 CSS 提取到一個單獨的 CSS 檔案 (只用在生產環境中)，也可以是一個傳遞給 `extract-text-webpack-plugin` 的選項物件
        extract: true,

        // 是否開啟 CSS source map？
        sourceMap: false,

        // 為前處理器的 loader 傳遞自定義選項。比如傳遞給Css-loader 時，使用 `{ Css: { ... } }`。
        loaderOptions: {
            css: {
                // 這裡的選項會傳遞給 css-loader
            },

            postcss: {
                // 這裡的選項會傳遞給 postcss-loader
            }

        },

        // 為所有的 CSS 及其預處理檔案開啟 CSS Modules，這個選項不會影響 `*.vue` 檔案。
        modules: false
    },

    // 在生產環境下為 Babel 和 TypeScript 使用 `thread-loader`，在多核機器下會預設開啟。
    parallel: require('os').cpus().length > 1,

    // PWA 外掛的選項。
    pwa: {},

    // 三方外掛的選項
    pluginOptions: {}
}