webpack/babel 转译删除对象键

Question

我正在使用 webpack/babel 转译代码，但出于某种原因，第三方软件包删除了一些代码。

第三方代码在其源代码中定义了一个类似于以下内容的常量：

const NOUNS = {
  people: {
    a: [1, 2],
    b: [3, 4],
  },
  places: {
    a: [5, 6],
    b: [7, 8],
  },
};

该包的 babel 编译步骤使用运行time-corejs3 最终输出以下内容：

import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';

var NOUNS = {
  people: (
    _people = {},
    /*#__PURE__*/_defineProperty(_people, 'a', [1, 2]),
    /*#__PURE__*/_defineProperty(_people, 'b', [3, 4]),
    _people
  ),
  places: (
    _places = {},
    /*#__PURE__*/_defineProperty(_places, 'a', [5, 6]),
    /*#__PURE__*/_defineProperty(_places, 'b', [7, 8]),
    _places
  ),
};

鉴于 _defineProperty 导入似乎委派给 Object.defineProperty。

，到目前为止情况看起来不错

然而，一旦我运行 webpack 在我自己的项目上，生成的代码最终看起来更像下面这样：

pa = {
  people: (zn = {},
    'a',
    1,
    2,
    'b',
    3,
    4,
    zn),
  places: (wn = {},
    'a',
    5,
    6,
    'b',
    7,
    8,
    zn)
}

本质上，_defineProperty 调用已被视为空操作，因为它们现在已丢失，传递给这些调用的参数仅被视为不执行任何操作的单独命令。结果是对象是空的，我基本上是这样结束的：

var NOUNS = {
  people: {},
  places: {},
};

我不清楚我的 babel 转译是什么导致了这种情况发生。如果需要，很乐意分享更多详细信息。

Answer 1

我想我明白了。该软件包在其构建中包含 babel-plugin-annotate-pure-calls，它可能需要排除。这就是添加 #__PURE__ 评论的原因，这些评论又会在我的应用 webpack/babel 转译过程中被删除。

webpack/babel 转译删除对象键

webpack/babel transpilation removing object keys

javascript

webpack

babeljs