vue.config.js

module.exports = {
    // 基础路径
    publicPath: "./",
    
    // 构建时的输出目录
    outputDir: "dist",

    // 用于多页面配置
    pages: {},

    productionSourceMap: false, // Default: true, 设为false，既可以减少包大小也可以加密源码


    devServer: {
        hot: true,
        host: 'localhost',
        port: "8080",
        open: 'Google Chrome',
        overlay: {
          warnings: false,
          errors: true
        },
        proxy: {}
    },

    // Webpack相关配置
    configureWebpack: {
    },

    // css相关配置
    css: {
        extract: true, // Default: 生产环境下是 true，开发环境下是 false是否将组件中的 CSS            提取至一个独立的 CSS 文件中 (而不是动态注入到 JavaScript 中的 inline 代码)
        sourceMap: false, // 是否为 CSS开启source map。设置为 true 之后可能会影响构建的性能
        
        // Default: {}, 向 CSS 相关的 loader 传递选项
        loaderOptions: {
            
            postcss: {
               plugins: [
                  autoprefixer(),
                  pxtovw({
                    viewportWidth: 375
                  })
                ]
              },
            less: {
                additionalData: '@import "~@/styles/variables.less";
            },
            
            scss: {
                // 配置全局可用的样式文件
                // sass-loader v8-, 这个选项是 "data"
                // sass-loader v8中, 这个选项是 "prependData"
                // sass-loader v8+, 这个选项是 "additionalData"
                additionalData: '@import "~@/styles/variables";
            }

            css: {
            }
            
        }
    }


}