ES6转换成ES5

最新推荐文章于 2024-09-20 14:48:33 发布

学习代表未来

最新推荐文章于 2024-09-20 14:48:33 发布

阅读量2.1k

点赞数 1

分类专栏： es6

原文链接：https://www.cnblogs.com/taokele/p/8528861.html

版权

es6 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

本文详细介绍了如何通过Babel将ES6语法转换为ES5，包括创建工程目录、初始化项目、安装所需依赖、配置.babelrc文件以及执行转换和实时监控的命令。同时，还提供了简化终端命令的方法，使得转换过程更为便捷。

摘要由CSDN通过智能技术生成

babel在线转换工具

1、建立工程目录

　　src:使用ES6语法编写的JS文件；

　　dist:使用Babel转换成ES5的文件，在项目引用的时候引用的是这个文件夹里边的JS文件

2、初始化项目

　　npm init -y

　　-y是指表示全部默认，不需要一个一个敲回车

3、全局安装Babel-cli

npm install -g babel-cli

4、本地安装babel-preset-es2015 和 babel-cli

npm install --save-dev babel-preset-es2015 babel-cli

5、新建.babelrc

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

6、输入终端转换命令

文件 babel src/index.js -o dist/index.js

文件夹  babel src -d dist

实时监控  babel src -w -d dist

***简化终端命令

　　修改package.json文件中的scripts,修改后为

{
  "name": "es6",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "babel src/index.js -o dist/index.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-cli": "^6.24.1",
    "babel-preset-es2015": "^6.24.1"
  }
}

然后运行 npm run build 进行转换