vue/cli 简单实用配置

# vue/cli 简单实用配置

vue/cli 4.2 vue.config.js 简单实用配置

// vue.config.js
const path = require("path");

function resolve(dir) {
  return path.join(__dirname, dir);
}
module.exports = {
  publicPath: "./",
  lintOnSave: true, //eslint-loader 是否在保存的时候检查
  productionSourceMap: false, // 不生成map文件
  chainWebpack: (config) => {
    config.resolve.alias
      .set("@", resolve("src"))
      .set("_public", resolve("public"))
      .set("_assets", resolve("src/assets"));
    config.plugin("html").tap((args) => {
      args[0].title = "xxxxx系统";
      args[0].favicon = path.resolve("./public/favicon.ico"); // 浏览器网页角标
      return args;
    });
		// 全局注入scss变量 需安装 sass-resources-loader 插件
    // const oneOfsMap = config.module.rule("scss").oneOfs.store;
    // oneOfsMap.forEach(item => {
    //   item
    //     .use("sass-resources-loader")
    //     .loader("sass-resources-loader")
    //     .options({
    //       // 要公用的scss的路径
    //       resources: ["./src/common/index.scss"]
    //     })
    //     .end();
    // });
  },
  css: {
    loaderOptions: {
      sass: {
        // sass
        prependData: `@import "@/plugins/_variables.scss";`, // 所有页面文件引入scss全局公共变量
      },
    },
  },
  devServer: {
    port: 8092, // 运行端口
    historyApiFallback: true,
    proxy: {
      // 开发环境跨域配置
      "/api": {
        target: "http://192.168.2.10:8088/",
        changeOrigin: true,
        pathRewrite: {
          //重写路径
          "^/api": "/",
        },
      },
    },
  },
};