0

Cтолкнулся с такой проблемой: объявление класса со свойством (приватным или нет - не важно)

'use strict';

class Mult {   value = 2;

  constructor(int) {
    this.int = int;   }

  double() {    return this.int * this.value;   } }

let val = new Mult(5);

console.log(val.double())

приводит к ошибке

    index.js:1 Uncaught Error: Module parse failed: Unexpected token (4:8)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| 
| class Mult {
>   value = 2;
| 
|   constructor(int) {
    at eval (index.js:1)
    at Object../app/js/index.js (bundle.js:96)
    at __webpack_require__ (bundle.js:20)
    at bundle.js:84
    at bundle.js:87

Сборка: gulp + webpack. Что это значит? Webpack не поддерживает классы ES6?

1
  • Webpack тут ни при чём, это ваша версия nodejs не поддерживает классы и вам нужно её обновить
    – andreymal
    21 янв 2020 в 11:11

2 ответа 2

1

Проблема решилась подключением babel и плагина @babel/plugin-proposal-class-properties. В webpack.config это выглядит так:

 module: {
    rules: [{
      test: /\.js$/,
      exclude: /node_modules/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['@babel/preset-env'],
          plugins: ['@babel/plugin-proposal-class-properties']
        }
      }
    }]
  },
0

В документации MDN по классам говорится

Public and private field declarations are an experimental feature (stage 3) proposed at TC39, the JavaScript standards committee. Support in browsers is limited, but the feature can be used through a build step with systems like Babel.

Попробуйте обновит ваш node.js или использовать Babel

4
  • Обновился с 12.14.1 до 13.6.0 - проблема осталась. Если не собирать webpackом в chrome(79) все работает.
    – artdemo
    21 янв 2020 в 13:03
  • @artdemo ну тогда babel подключайте
    – andreymal
    21 янв 2020 в 13:27
  • Если я правильно понял, babel это библиотека для поддержки браузеров не понимающих es6. Но если я пишу только для современных движков, то babel мне не нужен? Получается либо babel+webpack либо никак?
    – artdemo
    21 янв 2020 в 13:42
  • Стрелочные функции, деструктуризация и и вот эти вот скобки работают, а свойства классов нет.
    – artdemo
    21 янв 2020 в 13:44

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.