Функции стрелок в классе бросают ошибку с webpack-encore - PullRequest
0 голосов
/ 21 мая 2018

Конфигурация

Я использую с моим проектом для компиляции моего .До сих пор я использовал базовую настройку webpack.config.js, которая должна работать из коробки с реакцией при включении :

// webpack.config.js
// ...

Encore
    // ...
    .enableReactPreset()
;

Что я пробовал:

Я пошел дальше и добавил конфигурации Babel (которые я не считаю нужными) в надежде, что это решит проблему, но это не помогло:

.configureBabel(function(babelConfig) {
        // add additional presets
        babelConfig.presets.push('es2017');
    })

Пример кода:

Вот пример того, что должно работать, но он не компилируется и выдает следующую ошибку:

Синтаксическая ошибка: неожиданный токен

import React, {Component} from 'react';

//This works
const someExteriorHandler = () => {};

export default class Example extends Component {
   //error bad syntax, points specifically at the equal sign.
   someHandler = () => {

   }
   render(){return(<h1>This is a test</h1>)}
}

Вопрос

Как получить компилятор babel в для компиляции функций Arrow в классах?

1 Ответ

0 голосов
/ 21 мая 2018

Эта проблема была решена .

Назначение функций стрелок в классе не является частью ES6.Он является частью проекта предложения для будущей версии ES.Babel может его перенести, но вам нужно включить это преобразование в файле babelrc.Конфигурация babel по умолчанию, поставляемая в Encore, когда вы не настраиваете babel, не позволяет передавать экспериментальные функции.

Установка экспериментальных функций

yarn add --dev babel-plugin-transform-class-properties babel-plugin-transform-object-rest-spread

Настройка webpack.config.js

.configureBabel(function(babelConfig) {

    //This is needed.

    babelConfig.plugins = ["transform-object-rest-spread","transform-class-properties"]
})

Теперь он должен скомпилироваться со всеми функциями JSX.

...