Question

插件在Presets之前运行。

插件排序是第一位的。

预设顺序相反（从最后到第一个）。

特定于某个环境的选项将合并到并覆盖非env特定选项。

文档并没有确切地说明它们是如何合并的。

我正在使用样板文件React项目react-slingshot，我想利用类属性转换。该项目使用babel-preset-stage-1，其中包含babel-plugin-transform-class-properties。类属性转换应该让我编写如下代码：

class Example extends Component {
  static propTypes = {
    ...
  }
}

该项目中的.babelrc是：

{
  "presets": [
    "react",
    "stage-1"
  ],
  "env": {
    "development": {
      "presets": [
        "latest",
        "react-hmre"
      ]
    },
    "production": {
      "presets": [
        ["latest", {
          "es2015": {
            "modules": false
          }
        }]
      ],
      "plugins": [
        "transform-react-constant-elements",
        "transform-react-remove-prop-types"
      ]
    },
    "test": {
      "presets": [
        "latest"
      ]
    }
  }
}

但是当按原样使用时，我得到：

Module build failed: SyntaxError: Missing class properties transform.

  5 |   class Example extends Component {
> 6 |     static propTypes = {
    |     ^
  7 |       ...
  8 |     }
  9 |

类属性转换就在那里，但显然排序是不合适的。

我确实通过手动将非env预设合并到env预设中来编译而没有任何错误，但现在有很多重复：

{
  "env": {
    "development": {
      "presets": [
        "latest",
        "react-hmre",
        "stage-1",
        "react"
      ]
    },
    "production": {
      "presets": [
        ["latest", {
          "es2015": {
            "modules": false
          }
        }],
        "stage-1",
        "react"
      ],
      "plugins": [
        "transform-react-constant-elements",
        "transform-react-remove-prop-types"
      ]
    },
    "test": {
      "presets": [
        "latest",
        "stage-1",
        "react"
      ]
    }
  }
}

在使用env和非env选项时，有没有办法指定插件顺序？

Answer 1

.babelrc env继承就像类一样，它不是深层复制presets / plugins.so这就是为什么babel产生预设＆amp;开发人员以不同的方式使用的插件。你可以组合预设/插件来共享一些东西......如下所示的enel继承：

Object.assign({presets:['es2015']},env.development);
//it not merge your presets,that I have tested.
// if your env.development have a presets:['es2017'] then use es2017 otherwise use es2015

将env选项与非env选项合并时的Babel插件顺序

1 个答案: