SyntaxError с использованием оператора распространения в webpack.config.js

В моем webpack.config.js я импортирую несколько объектов JS для конфигурации из других файлов. Эти объекты составляются с использованием оператора распространения. Бывший. в build.js

const otherObj = { a:[], b: [] }
const conf = {
  prop1: [],
  ...otherObj
}

Затем я хочу использовать эти объекты в webpack.config.js следующим образом:

const { prop1, a, b } = require('./build.js');
module.exports = {
    entry: { prop1, a, b },
    rules: [
      {
        test: jsRegex,
        exclude: /node_modules/,
        use: ["babel-loader"]
      },
    ]
}

Когда я запускаю сценарий сборки, я получаю SyntaxError:

    ...otherObj,
^^^
SyntaxError: Unexpected token ...

ПРИМЕЧАНИЕ. Здесь следует расширение .babelrc.

    {
    "presets": [
        "@babel/preset-env"
    ],
    "plugins": [
        "@babel/syntax-object-rest-spread"
    ] 
}
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
0
1 437
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Это зависит от версии node, которую вы используете. Например, при использовании узла v6.15.1 (Boron) будет возвращена та же ошибка, что и у вас, но при работе на v8.14.0 (Carbon) он компилируется нормально.

Использовать узел

Убедитесь, что используемая вами версия узла поддерживает необходимые вам функции.

Используемая вами функция свойства распространения объекта была добавлена ​​на v8.6.0 (работающий узел без флагов).

Используйте babel

Вы можете перенести конфигурацию вашего веб-пакета, таким образом вы можете использовать свою текущую версию узла и использовать все функции ES6, которые вам могут понравиться.

Спасибо @ a - m! только что обновил Node до 8.12.0, и теперь он работает нормально.

Salvatore Dibenedetto 10.12.2018 14:16

Здорово! Следите за тем, какие функции поддерживаются, поскольку поддержка node по-прежнему частичная.

a--m 10.12.2018 14:19

Вы должны добавить файл .babelrc, как показано ниже.

Затем установите: npm i babel-plugin-transform-object-rest-spread

{
    "presets": ["env", "react"],
    "plugins": ["transform-object-rest-spread"]

}

Это сработало для меня, попробуйте!

Другие вопросы по теме