您的位置:首页 > 其它

ES6转ES5

2019-05-17 16:31 239 查看

ES6转ES5

一.ES6简介

ECMAScript2015,更新语法、规则、功能
浏览器对ES6的支持程度并不是很好,如果写了ES6的代码,需要运行在浏览器上的时候,需要将ES6的代码转成ES5的代码去浏览器上运行。
NodeJS平台是可以支持绝大部分的ES6的新内容。

二.安装nodejs

可以在我的云盘下载:https://pan.baidu.com/s/1jKKPefEwSlxoOQ7xRpHRGg
提取码:0ojn
在终端运行,查看是否出现版本号是否运行成功。

> node -v
> npm -v

Node.js js解析器 类似JVM ;

三.将ES6的代码转换成ES5的代码

转换工具:

babel-cli

转换规则:

babel-preset-es2015
babel-preset-env
babel-preset-latest

1.安装需要的工具

安装转换工具:

>cnpm install -g babel-cli-g 全局安装
没有-g 本目录安装

安装转换规则:

>cnpm install -g babel-preset-es2015

2.创建根目录,并在根目录下创建src目录和dist目录

src目录用于存放并编辑ES6代码,
dist目录用于存放解码后的代码

3.执行npm init -y,初始化成一个node项目,一路回车生成package.json

4.在项目根目录底下创建一个.babelrc文件,用来配置babel转换

{
"presets":["es2015"]
}

5.转换

转换文件babel a.js --out-file b.js
转换目录babel src --out-dir dist

高级转换

创建文件夹,进入文件夹
1.npm init -y 创建node项目

会有一个package.json文件,这里面有项目所要下载的包记录。

2.下载依赖
cnpm install --save-dev babel-clicnpm install --save-dev babel-preset-es2015
--save-dev  开发阶段用到的依赖
--save      产品阶段用到的依赖
3.在项目根目录底下创建一个.babelrc文件,用来配置babel转换
{
"presets":["es2015"]
}
4.转换
babel a.js
转换文件: babel a.js --out-file b.js
转换目录: babel src --out-dir dist
babel 2-const.js --out-file 2-babelConst.js
当没有node_modules的时候,可以参照package.json。使用cnpm install3.

在package.json中
“scripts”: {
“test”: “echo “Error: no test specified” && exit 1”,
“build”:“babel src --out-dir dist”
},
在项目cmd中直接运行 npm run build ,相当于运行:babel src --out-dir dist

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: