指定Output Name后Rollup未生成全局变量的原因排查

尝试用Rollup构建AWS Chime SDK for JavaScript的单文件版本，预期生成的amazon-chime-sdk.min.js可通过全局变量ChimeSDK访问SDK，但最新版本构建后该全局变量不存在，依赖代码报错“ChimeSDK未定义”。旧版SDK（2.x）构建正常，试过切换UMD/IIFE格式、升级依赖、禁用terser均未解决问题。

所用Rollup配置（rollup.config.js） #

import commonjs from '@rollup/plugin-commonjs';
import resolve, { nodeResolve } from '@rollup/plugin-node-resolve';
import json from '@rollup/plugin-json';
import terser from '@rollup/plugin-terser';

export default {
  input: 'src/index.js',
  output: [
    {
      file: 'build/amazon-chime-sdk.min.js',
      format: 'umd',
      name: 'ChimeSDK',
      sourcemap: true,
    },
  ],
  plugins: [
      [nodeResolve({
        browser: true,
        mainFields: ['module','browser'],
      })],
      json(),
      commonjs()
      //,
      //[terser()]
    ],
  onwarn: (warning, next) => {
    if (warning.code === 'CIRCULAR_DEPENDENCY') {
      // TODO: Fix https://github.com/aws/amazon-chime-sdk-js/issues/107
      return;
    } else if (warning.code === 'EVAL') {
      return;
    } else if (warning.code === 'THIS_IS_UNDEFINED') {
      // https://stackoverflow.com/questions/43556940/rollup-js-and-this-keyword-is-equivalent-to-undefined
      return;
    }
    next(warning);
  },
};

源文件src/index.js内容 #

export * from 'amazon-chime-sdk-js';

构建后文件关键片段 #

文件开头 #

(function (factory) {
    typeof define === 'function' && define.amd ? define(factory) :
    factory();
})((function () { 'use strict';

    var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
//etc

文件末尾相关代码 #

var hasRequiredBuild;

    function requireBuild () {
        if (hasRequiredBuild) return build$7;
        hasRequiredBuild = 1;
        (function (exports) {
            Object.defineProperty(exports, "__esModule", { value: true });
            exports.DefaultEventController = exports.DefaultDevicePixelRatioMonitor = exports.DefaultDeviceController = exports.DefaultContentShareController = exports.DefaultBrowserBehavior = exports.DefaultAudioVideoFacade = 
//etc

解决方法 #

• 修正插件配置格式：当前plugins数组中nodeResolve被错误嵌套在数组里，Rollup插件无需额外数组包裹，直接传入实例即可：

  plugins: [
    nodeResolve({
      browser: true,
      mainFields: ['module','browser'],
    }),
    json(),
    commonjs()
    //, terser()
  ],
  

• 调整导出逻辑：修改src/index.js，明确导入SDK并作为默认导出，让Rollup能识别需要挂载到全局的对象：

  import * as ChimeSDK from 'amazon-chime-sdk-js';
  export default ChimeSDK;
  

• 确认输出配置：保证output中的format为umd、name为ChimeSDK，Rollup会基于此将默认导出挂载到全局对象（window/global）上。

完成修改后重新执行rollup --config rollup.config.js，构建后的文件即可正常生成全局ChimeSDK变量。

内容的提问来源于stack exchange，提问作者timanderson