Как я могу использовать поля класса с Parcel Bundler?

Я получаю сообщение об ошибке «Missing class properties transform.», когда использую объявления поля public ES6 Class. Как я могу изменить настройки своей посылки, чтобы разрешить это?

Текущий код

index.html

<body>
  <div id="greeting"></div>
  <script src="./app.js"></script>
</body>

app.js

class Greeter {
  greeting = 'Hello';

  constructor(container, name) {
    container.innerText = `${this.greeting} ${name}`;
  }
}

new Greeter(document.querySelector('#greeting'), 'Justin');

Обходной путь

Я могу заставить это работать, только если удалю объявление greeting = 'Hello';:

class Greeter {

  constructor(container, name) {
    this.greeting = 'Hello';
    container.innerText = `${this.greeting} ${name}`;
  }
}

new Greeter(document.querySelector('#greeting'), 'Justin');

person Justin    schedule 16.12.2019    source источник
comment
@LawrenceCherone Мой браузер совместимость не является проблема. У вас есть решение, использующее Babel и Parcel?   -  person Justin    schedule 17.12.2019


Ответы (1)


Добавьте в файл .babelrc следующее:

{
  "plugins": ["@babel/plugin-proposal-class-properties"]
}

См. @ babel / plugin-offer-class-properties для подробнее. У вас должна быть возможность использовать общедоступный, статический и новый частные поля тоже.

person AnthumChris    schedule 17.12.2019