Как перейти на babel 7

Babel изменил название модуля babel-core на @ babel / core. Просто запустите npm install @babel/core. Это установит последнюю версию ядра Babel.

Большинство пакетов в Babel было переименовано в соответствии с шаблоном @babel/PACKAGE_NAME. Поэтому, если вы хотите выполнить обновление, измените имена пакетов в соответствии с шаблоном и запустите npm install.

Для обновления до Babel 7 вы можете использовать этот руководство по миграции.

Вы можете использовать babel-upgrade для плавного обновления.

https://github.com/babel/babel-upgrade

После этого вам может понадобиться npm prune, чтобы отказаться от устаревших пакетов в node_modules.

Обновлено:

Когда я попробовал babel-upgrade, конфигурация babel и webpack не была изменена. поэтому мне пришлось изменить его вручную. Вот пример.

.babelrc

"presets": ["@babel/env", "@babel/react"]

конфигурация webpack

loader: 'babel-loader',
options: { presets: ['@babel/env', '@babel/react']}

Используйте Бабель-апгрейд

Проверено на [email protected], [email protected] и [email protected]

Вы можете использовать следующий сценарий. (npx только на узле 5+)

npx babel-upgrade --write

Флаг --write записывает обновления в ваши package.json и .babelrc.

В результате вы получите следующие модификации package.json:

"devDependencies": {
    "@babel/core": "^7.4.0",
    "@babel/plugin-proposal-class-properties": "^7.0.0",
    "@babel/plugin-proposal-json-strings": "^7.0.0",
    "@babel/plugin-proposal-private-methods": "^7.4.0",
    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
    "@babel/plugin-syntax-import-meta": "^7.0.0"
}

.babelrc

{
  "plugins": [
    "@babel/plugin-syntax-dynamic-import",
    "@babel/plugin-syntax-import-meta",
    [
      "@babel/plugin-proposal-class-properties"
    ],
    "@babel/plugin-proposal-json-strings",
    [
      "@babel/plugin-proposal-private-methods"
    ]
  ]
}

Из вышеперечисленных плагинов вам понадобится @babel/plugin-proposal-class-properties @babel/plugin-proposal-private-methods для правильной работы частных свойств, если вы решите их реализовать.

Если вы используете eslint, не забудьте установить парсер как Babel-Eslint, как в вашем файле .eslintrc:

{
    "parser": "babel-eslint"
}