文章

vue3的vue.config.js的一些项目基础配置

const autoprefixer = require("autoprefixer");
const pxtorem = require("postcss-pxtorem");

module.exports = {
  chainWebpack: (config) => {
    // 配置启用sass scss
    config.module
      .rule("less")
      .use("less-loader")
      .loader("less-loader")
      .options({
        lessOptions: {
          /**less-loader 配置 */
          strictMath: true,
          noIeCompat: true,
        },
      });
    // 配置网站的 title 标题
    config.plugin("html").tap((args) => {
      args[0].title = "your site title";
      return args;
    });
  },
  outputDir: "dist",
  publicPath: process.env.NODE_ENV === "production" ? "/" : "/",
// 移动端像素转换配置
  css: {
    loaderOptions: {
      postcss: {
        plugins: [
          autoprefixer(),
          pxtorem({
            rootValue: 37.5,
            propList: ["*"],
          }),
        ],
      },
    },
  },
// 本地开发代理设置
  devServer: {
    open: false,
    // 跨域
    proxy: {
      "/api/": {
        // target: "https://your.domain/",
        target: "https://your.domain/",
        changeOrigin: true,
      },
    },
  },
};

许可协议:  CC BY 4.0