利用babel工具将es6语法转换成es5,Object.assign方法报错
一、新建工程初始化项目
1.新建工程文件夹这里起名叫做es6,然后在里面创建两个文件夹分别为src 、dist如下图:(src为待转换es6 js存放目录,dist为编译完成后的es5 js存放目录)

2、在src目录下新建一个js文件,里面输入es6的代码
3. 初始化项目
npm init
二、全局安装babel工具
1)在终端中输入以下命令,
npm install -g babel-cli
2)安装转换包
npm install --save-dev babel-preset-es2015 babel-cli
3)在实际项目中es6转es5后可能出现Object.assign()未定义,因此还需安装Babel套件与插件
1 安装 (适用于Object.assign() 的插件)
npm install babel-plugin-transform-object-assign
2.安装 (适用于展开运算符 的插件)
npm install babel-plugin-transform-object-rest-spread
三、新建.babelrc

四、修改package.json

最后:npm run build
利用babel工具将es6语法转换成es5,Object.assign方法报错的更多相关文章
- 利用babel自动编译es6文件
一.检查File-Watchers中Babel的Arguments,有一项presets的设置,把他更改为=es2015,详细设置如下: $FilePathRelativeToProjectRoot$ ...
- 使用babel把es6代码转成es5代码
第一步:创建一个web项目 使用命令:npm init 这个命令的目的是生成package.json. 执行第二步中的命令后生成的package.json的文件的内容是: { "name&q ...
- 利用反射将Datatable、SqlDataReader转换成List模型
1. DataTable转IList public class DataTableToList<T>whereT :new() { ///<summary> ///利用反射将D ...
- 使用命令行工具将Android应用转换成BlackBerry PlayBook应用
昨天写了篇文章关于Android应用转换的,通过BlackBerry的在线转换工具将Android应用转换成BlackBerry PlayBook应用.有网友反映说方法有点麻烦,所以今天补上新的转换方 ...
- 【ES6学习笔记之】Object.assign()
基本用法 Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target). const target = { a: 1 }; const sou ...
- 自制 Python小工具 将markdown文件转换成Html文件
今天看到了一个Python库,名为markdown.瞬间就给了我一个灵感,那就是制作一个将markdown文件转换成html文件的小工具. 我的实验环境 操作系统: Windows 7 64位 旗舰版 ...
- Protocol Buffer使用转换工具将proto文件转换成Java文件流程及使用
Client与Server的网络通信协议传输使用google protobuf,服务器端使用的是Java 一. Protocol Buffersprotobuf全称Google Protocol Bu ...
- Webpack4 学习笔记三 ES6+语法降级为ES5
前言 此内容是个人学习笔记,以便日后翻阅.非教程,如有错误还请指出 Webpack 将es6.es7语法降级为es5 需要通过 babel JavaScript编译器. 安装: npm i babel ...
- ES6 代码转成 ES5 代码的实现思路是什么(来自github每日一题)
将代码字符串解析成抽象语法树,即所谓的 AST 对 AST 进行处理,在这个阶段可以对 ES6 代码进行相应转换,即转成 ES5 代码 根据处理后的 AST 再生成代码字符串 每日一题https:// ...
随机推荐
- Oracle 回滚段undo
Undo的作用 数据的回滚 一致性读 表的闪回(事务,查询的闪回..) 失败会话的恢复 回滚rollback操作 SQL> archive log list; ORA-01031: 权限不足 S ...
- opentracting+jager分布式链路追踪探索实践
一.Opentracing opentracing通过提供平台无关.厂商无关的API,使得开发人员可以方便地实现追踪系统.opentracing提供了用于运营支撑系统和针对特定平台的辅助程序库,被跟踪 ...
- touchstart 事件与 click 事件的冲突
const clickEvent = (function() { if ('ontouchstart' in document.documentElement === true) retu ...
- CSS居中的多种方法
1.水平居中:text-align 与 inline-block 的配合 <div id = "div_center_align"> <div id = &quo ...
- linux基础命令一、
命令格式: 命令 -选项 参数 uname -r 查看内核版本 uname -m 查看系统版本 alias 别名. 举例: alias grep ='grep --color=auto' ...
- python模块hashlib、xlwt、pymysql
一.xlwt xlwt是python第三方模块,主要是对excel的写操作.xlwt使用时必须先安装. 1.安装 在操作系统的cmd窗口输入pip install xlwt回车即可在线安装. 安装完成 ...
- C#开发PACS医学影像处理系统(十七):2D处理之影像旋转和翻转
1.任意角度旋转 在XAML设计器中,设置RotateTransform属性 <InkCanvas x:Name="ToolInkCanvas" UseCustomCurso ...
- hystrix文档翻译之运维
hystrix不仅用作工程可靠性还可以用来运维. 这里将会分享一个拥有100+Hystrix命令,40+线程池,每天有100亿次线程请求,2000亿次信号量请求的系统是如何使用hystrix运维的.这 ...
- QQDIV失效补救
{"styleId":22,"bgId":3807,"cardId":3807,"renderInfo":{" ...
- 使用PyCharm引入需要使用的包
在学习python的时候,被推荐了使用PyCharm这款IDE,但是经常在已经pip安装第三方包的时候import包的时候却发生了问题- -无法引入. 进行模块的加载,百度之后,了解到,在这款IDE中 ...