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()。< / p>

修改

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

修改

好的，所以我把它缩小到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

这是一个Babeljs bug

见

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

希望这会有一个快速修复。

编辑＃2942没有引用相同的错误。以下是此错误的问题：#3028

Answer 2

这取决于你如何执行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"));

使用browserify babelify 6并且es2015预设无效

2 个答案: