У мене є цей код:

"use strict";

import browserSync from "browser-sync";
import httpProxy from "http-proxy";

let proxy = httpProxy.createProxyServer({});

і я встановив babel-coreі в babel-cliусьому світі через npm. Справа в тому, що я намагаюся компілювати це з моїм терміналом:

babel proxy.js --out-file proxified.js

Вихідний файл отримує скопійовано замість компільованого (я маю на увазі, це те саме, що і вихідний файл).

Що я тут пропускаю?

Вавілон - це структура трансформації. Попередньо 6.x він давав змогу певні перетворення за замовчуванням, але із збільшенням використання версій Node, які в основному підтримують багато функцій ES6, стало набагато важливіше, щоб речі були налаштовані. За замовчуванням Babel 6.x не проводить жодних перетворень. Вам потрібно сказати, які перетворення виконувати:

npm install babel-preset-env

і біжи

babel --presets env proxy.js --out-file proxified.js

або створити .babelrcфайл, що містить

{
    "presets": [
        "env"
    ]
}

і запускайте його так, як ви були раніше.

envу цьому випадку є попередньою задачею, яка в основному говорить про складання всієї стандартної поведінки ES * для ES5. Якщо ви використовуєте версії Node, які підтримують деякі ES6, можливо, вам варто подумати про те

{
    "presets": [
        ["env", { "targets": { "node": "true" } }],
    ]
}

щоб вказати попередньо встановленому лише обробляти речі, які не підтримуються вашою версією Node. Ви також можете включити версії браузера в цілі, якщо вам потрібна підтримка браузера.

Більшість цих відповідей є застарілими. @babel/preset-envі "@babel/preset-reactце те, що вам потрібно (станом на липень 2019 року).

У мене була та сама проблема з іншою причиною:

Код, який я намагався завантажити, не знаходився під каталогом пакунків, і Babel не використовує за замовчуванням трансляцію за межами каталогу пакунків.

Я вирішив це, перемістивши імпортований код, але, можливо, я міг би також використати якусь заяву включення у конфігурацію Babel.

Спочатку переконайтеся, що у вас є node modules:

npm i -D webpack babel-core babel-preset-es2015 babel-preset-stage-2 babel-loader

Далі додайте це у свій конфігураційний файл Webpack ( webpack.config.js):

// webpack.config.js
...
module  :  {
  loaders  :  [
    {
      test    :  /\.js$/,
      loader  :  'babel',
      exclude :  /node_modules/,
      options :  {
        presets  :  [ 'es2015', 'stage-2' ] // stage-2 if required
      } 
    } 
  ]
}
...

Список літератури:

• https://gist.github.com/Couto/6c6164c24ae031bff935
• https://github.com/babel/babel-loader/isissue/214

Щасти!

Станом на 2020, Jan:

КРОК 1: Встановіть Babel presets:

yarn add -D @babel/preset-env @babel/preset-react

КРОК 2: Створіть файл: babelrc.jsі додайте presets:

module.exports = {
  // ...
  presets: ["@babel/preset-env", "@babel/preset-react"],
  // ...
}

КРОК 3: - Встановіть babel-loader:

yarn add -D babel-loader

КРОК 4: - Додайте конфігурацію завантажувача у ваші webpack.config.js:

{
//...
  module: [
    rules: [
      test: /\.(js|mjs|jsx|ts|tsx)$/,
      loader: require.resolve('babel-loader')
    ]
  ]
//...
}

Щасти...

npm install --save-dev babel-preset-node5

npm install --save-dev babel-preset-react

... а потім створити за .babelrcдопомогою пресетів:

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

... вирішив дуже схоже для мене питання, що стосується бабеля 3.8.6та вузлаv5.10.1

https://www.npmjs.com/package/babel-preset-node5
https://www.npmjs.com/package/babel-preset-react

Одна і та ж помилка, інша причина:

Транспілінг працював раніше, а потім раптом перестав працювати, а файли просто копіювались як є.

Виявляється, я .babelrcв якийсь момент відкрив, і Windows вирішила додати .txtім’я файлу. Тепер це .babelrc.txtне було визнано дівочим Видалення .txtсуфікса зафіксувало це.

виправити свій .babelrc

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

У 2018 році:

Встановіть наступні пакети, якщо ви ще цього не зробили:

npm install babel-loader babel-preset-react

webpack.config.js

{
    test: /\.jsx?$/,
    exclude: /node_modules/,
    use: [
      {
        loader: 'babel-loader',
        options: {
          presets: ['es2015','react']  // <--- !`react` must be part of presets!
        }
      }
    ],
  }

Кінцеве рішення

Я витрачав на це 3 дні

import react from 'react' unexpected identifier

Я спробував модифікувати webpack.config.jsі package.jsonфайли, а також додавати .babelrc, встановлювати та оновлювати пакети через npm, я відвідав багато, багато сторінок, але нічого не вийшло.

Що спрацювало? Два слова: npm start. Це вірно.

запустити

npm start 

команда в терміналі для запуску локального сервера

...

(майте на увазі, що це може не працювати відразу, але, можливо, лише після того, як ви виконаєте якусь роботу в npm, тому що перед тим, як спробувати це, я видалив усі зміни в цих файлах, і вони спрацювали, тому після того, як ви дійсно зробите, ставитесь до цього як до свого останнього курорт )

Я знайшов цю інформацію на цій акуратній сторінці . Це польською мовою, але не соромтеся користуватися перекладом Google.