Ошибка синтаксиса Babel Loader и Webpack + React

Я использую React + Webpack и Babel Loader для своего проекта.

Когда я пытаюсь сгенерировать код пакета, возникает следующая ошибка (для каждого редуктора, который у меня есть при использовании {... state}):

@ ./src/reducers/index.js 29:21-47
 @ ./src/index.js

ERROR in ./src/reducers/logged_navbar.js
Module build failed: SyntaxError: C:/xampp/htdocs/scoala-de-iarna/src/reducers/logged_navbar.js: Unexpected token (8:12)

   6 |                  let data = _.mapKeys(action.payload.data, 'id');
   7 |                  state.navbarLogged = data;
>  8 |                  return { ...state };
     |                           ^
   9 |          default: return state;
  10 |  }
  11 | }

Однако при тестировании приложения на сборке для разработчиков эта ошибка не отображается.

веб-пакет.config.js:

var webpack = require('webpack');
var path = require('path');

var BUILD_DIR = path.resolve(__dirname, 'src/bundle');
var APP_DIR = path.resolve(__dirname, 'src');

var config = {
  entry: APP_DIR + '/index.js',
  output: {
    path: BUILD_DIR,
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        include: APP_DIR,
        exclude: /node_modules/,
        loader: 'babel-loader',
      }
    ]
  }
};

module.exports = config;

.babelrc:

{
    "presets" : ["es2015", "react"]
}

person Moldovan Andrei    schedule 21.11.2017    source источник
comment
попробуйте установить и добавить stage2 в пресеты npm install --save-dev babel-preset-stage-2 "presets" : ["es2015", "react", "stage-2"]   -  person Anis Smail    schedule 21.11.2017
comment
@AnisSmail, не удается найти предустановку «стадия-2» относительно каталога ‹root_directory›. Установка пакета сейчас   -  person Moldovan Andrei    schedule 21.11.2017
comment
Блестяще решено. Большое спасибо!   -  person Moldovan Andrei    schedule 21.11.2017


Ответы (2)


Решение 1

Установите и добавьте «stage2» в пресеты

npm install --save-dev babel-preset-stage-2

"presets" : ["es2015", "react", "stage-2"]

Решение 2

Установите и добавьте в плагины babel-plugin-transform-object-rest-spread

npm install --save-dev babel-plugin-transform-object-rest-spread

{ "plugins": ["transform-object-rest-spread"] }

person Anis Smail    schedule 21.11.2017

оператор распространения объекта в настоящее время все еще находится на этапе 3 и не доработан. По этой причине он не включен в ядро ​​Babel.


Чтобы скомпилировать его с помощью babel, включите этап 3 в ваша конфигурация Babel:

{
    "presets" : ["es2015", "stage-3", "react"]
}
person TimoStaudinger    schedule 21.11.2017
comment
Сделали это со стадией 2. В чем разница между стадией 2 и стадией 3? - person Moldovan Andrei; 21.11.2017
comment
stage-2 включает предложения 2-го и 3-го этапов, stage-3 включает только предложения 3-го этапа. - person TimoStaudinger; 21.11.2017