老版本浏览器不支持ES6语法，使用Babel 转换器转成ES5

^草莓牛乳茶^

已于 2024-02-19 10:59:10 修改

阅读量419

点赞数 4

分类专栏： JavaScript 文章标签： es6 前端 javascript

于 2024-02-19 10:55:19 首次发布

本文链接：https://blog.youkuaiyun.com/2301_76882889/article/details/136165593

版权

JavaScript 专栏收录该内容

9 篇文章

订阅专栏

本文介绍了如何在JavaScript项目中使用Babel进行ES6转码，包括配置.babelrc文件，添加preset-env和preset-react规则，以及推荐的npm安装方法。链接提供了ES6简介以供进一步学习。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、

eg：

// 转码前
input.map(item => item + 1);

// 转码后
input.map(function (item) {
  return item + 1;
});

2、

使用：

npm install --save-dev @babel/core

3、配置.babelrc文件

Babel 的配置文件是.babelrc，存放在项目的根目录下。使用 Babel 的第一步，就是配置这个文件。

{
  "presets": [],
  "plugins": []
}

presets字段设定转码规则，官方提供以下的规则集，你可以根据需要安装。

# 最新转码规则
$ npm install --save-dev @babel/preset-env

# react 转码规则
$ npm install --save-dev @babel/preset-react

然后，将这些规则加入.babelrc。

  {
    "presets": [
      "@babel/env",
      "@babel/preset-react"
    ],
    "plugins": []
  }

4、其他使用可看阮一峰ES6简介

https://es6.ruanyifeng.com/#docs/intro