Aurelia/ES6类和属性定义,管道工语法错误

Question

我试图让Aurelia的入门应用程序正常工作,但我在第一页收到错误. http://aurelia.io/get-started.html

有问题的代码:

export class Welcome {
  heading = 'Welcome to the Aurelia Navigation App!';
  firstName = 'John';
  lastName = 'Doe';

  get fullName(){
    return `${this.firstName} ${this.lastName}`;
  }

  welcome(){
    alert(`Welcome, ${this.fullName}!`);
  }
}

错误 :

    [21:46:19] Plumber found unhandled error:
 SyntaxError in plugin 'gulp-babel'
Message:
    D:/workspace/aurelia/navigation-app/src/app.js: Unexpected token (2:10)
  1 | export class Welcome {
> 2 |   heading = 'Welcome to the Aurelia Navigation App!';
    |           ^
  3 |   firstName = 'John';
  4 |   lastName = 'Doe';
  5 |
[21:46:19] Finished 'build-system' after 20 ms

我不得不说我在Windows上,它可能会造成一些麻烦.

---

我通过将变量放在构造函数中来"解决"这个问题.但上面的语法是无效的ES6吗？是ES7或其他不可用的东西？

---

我知道这段代码看起来很奇怪,但我不是作者,它是Aurelia教程的原始代码

Answer 1

以下语法对于类不是有效的ES6语法.但是,它是类的有效ES7属性初始化程序语法.要使用它,如果您使用的是Babel,则需要确保专门启用此功能.这在Aurelia博客中有记录,它被配置为最新骨架的一部分.

export class Welcome {
  heading = 'Welcome to the Aurelia Navigation App!';
  firstName = 'John';
  lastName = 'Doe';

  get fullName(){
    return `${this.firstName} ${this.lastName}`;
  }

  welcome(){
    alert(`Welcome, ${this.fullName}!`);
  }
}