一、新建工程初始化项目

  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方法报错的更多相关文章

  1. 利用babel自动编译es6文件

    一.检查File-Watchers中Babel的Arguments,有一项presets的设置,把他更改为=es2015,详细设置如下: $FilePathRelativeToProjectRoot$ ...

  2. 使用babel把es6代码转成es5代码

    第一步:创建一个web项目 使用命令:npm init 这个命令的目的是生成package.json. 执行第二步中的命令后生成的package.json的文件的内容是: { "name&q ...

  3. 利用反射将Datatable、SqlDataReader转换成List模型

    1. DataTable转IList public class DataTableToList<T>whereT :new() { ///<summary> ///利用反射将D ...

  4. 使用命令行工具将Android应用转换成BlackBerry PlayBook应用

    昨天写了篇文章关于Android应用转换的,通过BlackBerry的在线转换工具将Android应用转换成BlackBerry PlayBook应用.有网友反映说方法有点麻烦,所以今天补上新的转换方 ...

  5. 【ES6学习笔记之】Object.assign()

    基本用法 Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target). const target = { a: 1 }; const sou ...

  6. 自制 Python小工具 将markdown文件转换成Html文件

    今天看到了一个Python库,名为markdown.瞬间就给了我一个灵感,那就是制作一个将markdown文件转换成html文件的小工具. 我的实验环境 操作系统: Windows 7 64位 旗舰版 ...

  7. Protocol Buffer使用转换工具将proto文件转换成Java文件流程及使用

    Client与Server的网络通信协议传输使用google protobuf,服务器端使用的是Java 一. Protocol Buffersprotobuf全称Google Protocol Bu ...

  8. Webpack4 学习笔记三 ES6+语法降级为ES5

    前言 此内容是个人学习笔记,以便日后翻阅.非教程,如有错误还请指出 Webpack 将es6.es7语法降级为es5 需要通过 babel JavaScript编译器. 安装: npm i babel ...

  9. ES6 代码转成 ES5 代码的实现思路是什么(来自github每日一题)

    将代码字符串解析成抽象语法树,即所谓的 AST 对 AST 进行处理,在这个阶段可以对 ES6 代码进行相应转换,即转成 ES5 代码 根据处理后的 AST 再生成代码字符串 每日一题https:// ...

随机推荐

  1. 09 promise then

    then() 方法返回一个 Promise 链式调用:then里面回调函数(成功回调和失败回调),凡事这两个回调函数里面抛出错误或者返回一个已经是拒绝状态的 Promise. 那么 then 返回的  ...

  2. ElasticsSearch初装 环境Win10

    步骤: 1.从 http://how2j.cn/frontdownload?bean.id=1694 下载6.22 版本 2.双击elasticsearch.bat启动ElasticsSearch [ ...

  3. python模块之----subprocess

    例子 >>> subprocess.getstatusoutput('pwd')(0, '/home/ronny')>>> subprocess.getoutput ...

  4. JavaScript 异步编程

    博客地址:https://ainyi.com/96 众所周知,JavaScript 是单线程的,但异步在 js 中很常见,那么简单来介绍一下异步编程 同步编程和异步编程 同步编程,计算机一行一行按顺序 ...

  5. JavaGuide易错点总结

    基础知识易错点 1. object.equals("str") 容易报空指针异常,应使用"str".equals(object); 还可以使用JDK7引入的工具 ...

  6. 向你的C语言项目中加入多线程

    C语言在标准库<pthread.h>中为程序员提供了多线程操作接口. 先从简单操作入手 int pthread_create(pthread_t *thread, pthread_attr ...

  7. C语言01

    从问题到C语言程序设计 1.1计算机的问题求解方法 程序设计面向的问题 什么问题可以用程序的方法解决? 打印九九乘法表 图形变换 文件压缩问题 ....... 一切可计算的问题 如何解决? 确定问题可 ...

  8. netty全局分析1

    这个系列都是别人的分析文 https://www.jianshu.com/p/ac7fb5c2640f 一丶 Netty基础入门 Netty是一个高性能.异步事件驱动的NIO框架,它提供了对TCP.U ...

  9. 再见了SpringMVC!这个框架有点厉害,甚至干掉了Servlet!

    # 前言 对 Java 开发者来说, Spring 发布 5.0 正式版,而新版 Spring 的一大特色,就是 Reactive Web 方案 Web Flux,这是用来替代 Spring Web ...

  10. 结合源码谈谈ThreadLocal!

    目录 ThreadLocal的作用 ThreadLocal 1.对象初始化 2.获取变量 3.设置变量 4.移除变量 ThreadLocalMap 1.Entry 2.初始化 3.获取Entry 4. ...