首页 > 解决方案 > 输出文件中的汇总 Babel 重复定义

问题描述

我正在尝试将汇总与 babel 一起使用,但在输出文件中我得到了重复的定义:

 var Projection =
  /*#__PURE__*/
  function () {
    /**
     * @param {Options} options Projection options.
     */
    function Projection(options) {
      _classCallCheck(this, Projection);

      /**
       * @private
       * @type {string}
       */
      this.code_ = options.code;

var Projection$1 = function Projection(options) {
    /**
     * @private
     * @type {string}
     */
    this.code_ = options.code;

    /**
     * Units of projected coordinates. When set to `TILE_PIXELS`, a
     * `this.extent_` and `this.worldExtent_` must be configured properly for each
     * tile.
     * @private
     * @type {module:ol/proj/Units}
     */
    this.units_ = /** @type {module:ol/proj/Units} */ (options.units);

我的汇总配置

// Rollup configuration for the full build

const path = require('path');
import noderesolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';
import {uglify} from 'rollup-plugin-uglify';
import sourcemaps from 'rollup-plugin-sourcemaps';
import babel from 'rollup-plugin-babel';
import alias from 'rollup-plugin-alias';
import minify from 'rollup-plugin-babel-minify';

const prod = process.env.BUILD === 'production';
const cesiumSource = 'node_modules/cesium/Source';
//const cesiumSource = 'Source/Cesium';
const olSource = 'ol_build/openlayers/src/ol';

const plugins = [
  noderesolve(),
  commonjs(),
];

// const uglifyPlugin = uglify({
    // compress: {
      // sequences: false, // workaround uglify bug with sequences
      // drop_console: true
    // }
  // });

const babelPlugin =  babel({
    babelrc: false,
    presets: [["@babel/preset-env", { modules: false }]],
    exclude: ['node_modules/**']
    // externalHelpers: true,
    // plugins: ["@babel/external-helpers"]
    // runtimeHelpers: true,
    // plugins: ["@babel/plugin-transform-runtime"]
});

const aliasPlugin = alias({
    ol: path.resolve(__dirname, olSource),
    Cesium: path.resolve(__dirname, cesiumSource)
  });

if (prod) {
  //plugins.push(uglifyPlugin);
  //plugins.push(minify);
}

plugins.push(babelPlugin);
plugins.push(aliasPlugin);
plugins.push(sourcemaps());

export default {
  input: './dist/index.js',
  output: [
    {file: prod ? './dist/ol.js' : './dist/ol-debug.js', format: 'iife', sourcemap: true}
  ],
  plugins
  //external: ['ol'],
};

以及与 babel 和 rollup 相关的 package.json 配置:

"devDependencies": {
    "@babel/core": "^7.1.2",
    "@babel/preset-env": "^7.1.0",
  "rollup": "0.65.2",
    "rollup-plugin-babel": "^4.0.3",
    "rollup-plugin-babel-minify": "^6.1.1",
    "rollup-plugin-commonjs": "9.1.6",
    "rollup-plugin-node-resolve": "3.4.0",
    "rollup-plugin-sourcemaps": "0.4.2",
    "rollup-plugin-uglify": "5.0.2",

 "dependencies": {
    "rollup-plugin-alias": "^1.4.0"
  }

当我在输出文件中仅使用不带 babel 的汇总时,只有 1 个“投影”定义。

原班:

class Projection {

  /**
   * @param {Options} options Projection options.
   */
  constructor(options) {
    /**
     * @private
     * @type {string}
     */
    this.code_ = options.code;

    /**
     * Units of projected coordinates. When set to `TILE_PIXELS`, a
     * `this.extent_` and `this.worldExtent_` must be configured properly for each
     * tile.
     * @private
     * @type {import("./Units.js").default}
     */
    this.units_ = /** @type {import("./Units.js").default} */ (options.units);

我尝试使用以前版本的 babel 进行汇总,还尝试使用“external-helpers”插件,但仍然无法正常工作。

Rollup 和 babel 对我来说是新的。

由于那些重复的定义,我在使用 instanceof 运算符比较类型时得到了错误。为什么有重复的定义以及如何配置 babel 以仅获取一个定义?

标签: javascriptnpmbabeljsrollup

解决方案


推荐阅读