带有 browserify 的 babelify 6 和 es2015 预设不工作
babelify 6 with browserify and the es2015 preset is not working
我正在尝试使用新的 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 的?
这在一定程度上取决于您如何执行 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"));
这是一个 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
我正在尝试使用新的 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 的?
这在一定程度上取决于您如何执行 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"));
这是一个 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