求助个 rollup 打包umd格式,requirejs加载模块问题
发布于 2 年前 作者 waitingsong 2901 次浏览 来自 问答
  • ts 开发。,tsc 输出 module 配置为 ‘es6’。 rxjs 版本为 v6.rc7
import {  fromEvent } from 'rxjs'
import {  share,  takeWhile } from 'rxjs/operators'
  • 使用 rollup 打包处理 tsc 生成的结果为 umd 格式
const globals = {
  'rxjs/operators': 'rxjs.operators',
  'rxjs/websocket': 'rxjs.websocket',
}

  // bundle min
  config.push({
    external: [],
    input: pkg.module,
    plugins: [
      resolve({
        browser: true,
        jsnext: true,
        main: true,
      }),
      commonjs(),
    ],
    output: {
      amd: { id: 'foo' },
      file:  'foo.js',
      format: 'umd',
      globals,
      name: 'foo',
      sourcemap: true,
    },
  })

打包结果:

(function (global, factory) {
  debugger
    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('rxjs'), require('rxjs/operators')) :
    typeof define === 'function' && define.amd ? define('foo', ['exports', 'rxjs', 'rxjs/operators'], factory) :
    (factory((global.foo = {}),null,global.rxjs.operators,global.rxjs));
}(this, (function (exports,rxjs,operators) { 'use strict';
...
})

配合 rxjs.umd.js . 若 foo.js 采用 script 全局加载,那么 rxjs.operators 都可能正常使用。 如果采用 requirejs 加载, main.js 配置为:

require.config({
  baseUrl: '../dist',
  paths:   {
    'rxjs':             'rxjs.umd',
    'foo': 'foo.umd',
  },
});

rxjs/operators 这个依赖会被处理为 rxjs.umd.js/operators.js 去加载。 有什么办法可以解决这个问题呢? rollup 以及 requirejs 的文档都没找到相关的处理。

2 回复

楼主放弃webpack了?

@chapgaga 从来都没用过 webpack 啊

回到顶部