带有 browserify 的 babelify 6 和 es2015 预设不工作

Question

我正在尝试使用新的 babel 版本，但在尝试使用 es2015 预设 babel 时似乎无法理解箭头功能？

我在 pre-babel6 上的设置如下：

transform: [['babelify', {sourceMap: false, stage: 0, optional: 'runtime', ignore: ["*.min.js"]}]]

和 babel6

transform: [['babelify', {"presets": ["es2015"]}]]

这是行不通的。这是为什么？

编辑

添加 "stage-0" 摆脱了语法错误消息，但阻止了我扩展任何错误： 'this' is not allowed before super() 当我实际上得到了 super() 调用.

编辑

使用一些 es7 设置一个简单的测试应用程序并尝试使用 babel-core require 钩子，同样的问题。

编辑

好的，所以我已经将它缩小到 stage-0，在 babeljs 6^ 中以不同的方式工作。

这是我注意到的：

运行文件

require("babel-core/register")(
    {
        presets: ["es2015", "stage-0"]
    }
);

require("./app.js");

适用于：

class extendable {
    constructor() {
        console.log('extended')
    }
}

class app extends extendable {

    constructor() {

        super();

        this.method();
        this.method2();
    }

    method() {
        // arrow functions
        setTimeout(() => {
            console.log("works")
        }, 1000)
    }

    /**
     * arrow function method
     */
    method2 = () => {
        console.log('works')
    }
}
new app();

不适用于：

class extendable {
    constructor() {
        console.log('extended')
    }
}

class app extends extendable {

    constructor() {

        super();

        this.method();
        this.method2();
    }

    method() {
        // arrow functions
        setTimeout(() => {
            console.log("works")
        }, 1000)
    }

    /**
     * arrow function method
     */
    method2 = () => {
        // give an error: 'this' is not allowed before super()
        this.state = "hello";
    }
}
new app();

所以我有点困惑。这真的是不正确的语法吗？我是如何使用这个 pre-babel6 的？

Answer 1

这在一定程度上取决于您如何执行 browserify，这是来自 babelify (https://github.com/babel/babelify) 的 Github 存储库关于它的描述：

来自 CLI：

$ browserify script.js -o bundle.js \
-t [ babelify --presets [ es2015 react ] ]

有节点：

browserify("./script.js")
  .transform("babelify", {presets: ["es2015", "react"]})
  .bundle()
  .pipe(fs.createWriteStream("bundle.js"));

Answer 2

这是一个 Babeljs 错误

见

Subclasses with class properties (without constructor) error #2942
[Regression BUG] Class scoped function showing SyntaxError: 'this' is not allowed before super() #2971

希望这会很快得到解决。

edit #2942 没有引用同一个错误。这是此错误之后的问题：#3028

带有 browserify 的 babelify 6 和 es2015 预设不工作

babelify 6 with browserify and the es2015 preset is not working

browserify

babeljs