webpack配置scss中获取环境变量

先配置变量 然后在vue.config.js中配置

module.exports = {
  chainWebpack: (config) => {
    config.resolve.alias
      .set("@", resolve("./src"))
      .set("components", resolve("./src/components"));
    const oneOfsMap = config.module.rule("scss").oneOfs.store;
    oneOfsMap.forEach((item) => {
      item
        .use("sass-loader")
        .loader("sass-loader")
        .options({
          data: "$env: '" + process.env.VUE_APP_FILE_URL + "';",
        })
        .end();
      item
        .use("sass-resources-loader")
        .loader("sass-resources-loader")
        .options({
          // Provide path to the file with resources
          resources: ["./src/styles/base.scss"],
        })
        .end();
    });
  },
  lintOnSave: false, //如果为false，就是取消eslint规则的检查
};

在.vue文件的style中使用，上面定义的是$env，使用时也是用$env