vue.config.js configureWebpack ProvidePlugin

 configureWebpack

configureWebpack有两种方式，一种是对象方式，一种是函数方式，下面只对函数方式做个简单的示例

configureWebpack函数方式

const path = require("path")
const webpack = require("webpack")

function resolve(dir) {
  return path.join(__dirname, ".", dir)
}

const buildConfig = {
    alias: {
        Api: resolve("src/Api/index.js"),
    }
}
module.exports = {  
  configureWebpack: (config) => {
    if (process.env.NODE_ENV === "production") {
      // 为生产环境修改配置...
      config.mode = "production"
    } else {
      // 为生产环境修改配置...
      config.mode = "development"
    }
    // 添加占位符
    config.resolve.alias = Object.assign(config.resolve.alias, buildConfig.alias)
    // 添加插件
    const _plugins = []
    // 全局引入
    _plugins.push(new webpack.ProvidePlugin({ Api: "Api" }))
    config.plugins = [...config.plugins, ..._plugins]
  },
}

什么是ProvidePlugin

作用：自动加载，而不必模块import或require，它们无处不在

在vue-cli3项目中的配置

跟vue-cli2.x配置有所区别的是需要在 .eslintrc.js 中 globals对象添加声明

// .eslintrc.js

module.exports = {
  root: true,
  env: {
    node: true,
  },
  // 需要在此声明
  globals: {
    Api: true,
  },
  extends: [...],
  parserOptions: {

  },
  rules: {
    ...
  },
}

vue-cli2.x的相关配置 https://www.cnblogs.com/dora-zc/p/10066932.html