在自定义的webpack插件中设置全局变量

class GlobalVariablePlugin {
  apply(compiler) {
    compiler.hooks.afterEnvironment.tap('GlobalVariablePlugin', () => {
      // 获取webpack配置中的resolve.alias
      const alias = compiler.options.resolve.alias;
      
      // 设置全局变量
      const globalVariable = {
        // 设置全局变量名
        variableName: 'MY_GLOBAL_VARIABLE',
        // 设置全局变量的值
        variableValue: JSON.stringify(alias),
      };
      
      // 设置webpack的全局变量
      compiler.options.output.library = globalVariable.variableName;
      compiler.options.output.libraryTarget = 'window';
      
      // 在构建过程中注入全局变量
      compiler.hooks.compilation.tap('GlobalVariablePlugin', (compilation) => {
        compilation.hooks.optimizeChunkAssets.tapAsync('GlobalVariablePlugin', (chunks, callback) => {
          chunks.forEach((chunk) => {
            chunk.files.forEach((file) => {
              // 在文件中注入全局变量
              compilation.assets[file] = new ConcatSource(
                `window.${globalVariable.variableName} = ${globalVariable.variableValue};`,
                '\n',
                compilation.assets[file]
              );
            });
          });
          
          callback();
        });
      });
    });
  }
}

module.exports = GlobalVariablePlugin;

const GlobalVariablePlugin = require('./GlobalVariablePlugin');

module.exports = {
  // webpack配置省略...
  plugins: [
    new GlobalVariablePlugin(),
  ],
};

const globalVariable = {
  variableName: 'MY_GLOBAL_VARIABLE',
  variableValue: JSON.stringify(alias),
};