@vue/cli 3配置文件vue.config.js

const webpack = require('webpack')
const path = require('path')
    // const CompressionWebpackPlugin = require('compression-webpack-plugin');
const productionGzipExtensions = ['js', 'css']
module.exports = {
    // 基本路徑
    publicPath: process.env.NODE_ENV === 'production' ? '/production-sub-path/' : './',
    // 輸出文件目錄
    outputDir: 'dist',
    // eslint-loader 是否在保存的時候檢查
    pages: {
        index: {
            // page 的入口
            entry: 'src/dyreleaseweb/main.js',
            // 模板來源
            template: 'public/index.html',
            filename: 'index.html',
            favicon: 'public/logo.ico',
            // 當使用 title 選項時，
            // template 中的 title 標籤須要是 <title><%= htmlWebpackPlugin.options.title %></title>
            title: '通稿稿件2.0',
            // 在這個頁面中包含的塊，默認狀況下會包含
            // 提取出來的通用 chunk 和 vendor chunk。
            chunks: ['chunk-vendors', 'chunk-common', 'index']
        },
        topic: {
            // page 的入口
            entry: 'src/topic/main.js',
            // 模板來源
            template: 'public/topic.html',
            // 在 dist/index.html 的輸出
            filename: 'topic.html',
            favicon: 'public/logo.ico',
            title: 'Topic Page',
            chunks: ['chunk-vendors', 'chunk-common', 'index']
        }
        // 當使用只有入口的字符串格式時，
        // 模板會被推導爲 `public/subpage.html`
        // 而且若是找不到的話，就回退到 `public/index.html`。
        // 輸出文件名會被推導爲 `subpage.html`。
        //   subpage: 'src/subpage/main.js'
    },
    chainWebpack: () => {},
    configureWebpack: {
        plugins: [
            new webpack.ProvidePlugin({
                $: 'jquery',
                jQuery: 'jquery',
                'windows.jQuery': 'jquery'
            })
        ]
    },
    productionSourceMap: true,
    // css相關配置
    css: {
        // 是否使用css分離插件 ExtractTextPlugin
        extract: true,
        // 開啓 CSS source maps?
        sourceMap: false,
        // css預設器配置項
        loaderOptions: {
            css: {

            },
            postcss: {
                /*  ident: 'postcss',
                         plugins: (loader) => [
                             require('postcss-import')({ root: loader.resourcePath }),
                             require('postcss-preset-env')(),
                             require('cssnano')()
                         ] */
            }
        },
        // 啓用 CSS modules for all css / pre-processor files.
        modules: true // 去掉文件名中的 .module
    },
    // use thread-loader for babel & TS in production build
    // enabled by default if the machine has more than 1 cores
    parallel: require('os').cpus().length > 1,
    // webpack-dev-server 相關配置
    devServer: {
        open: process.platform === 'darwin',
        host: '10.10.0.102',
        port: 8066,
        https: false,
        hotOnly: false,
        proxy: {
            '/api': {
                target: 'http://10.10.0.102:9010/',
                ws: true,
                changeOrigin: true,
                pathRewrite: {
                    '^/api': '/gateway'
                }
            },
            '/foo': {
                target: '<other_url>'
            }
        },
        before: app => {}
    },
    // 第三方插件配置
    pluginOptions: {
        // ...
    }
    // eslint-disable-next-line eol-last
}