es6 babel 安装以及使用

 

1,安装好node(需要使用npm包管理工具)

2,在本地项目路径下npm init,格式化成功后会在项目下生成一个配置文件package.json

3,本地安装bable npm install --save-dev babel-cli (如需卸载之前的babel使用命令  npm uninstall --global babel-cli),

  安装成功后,devDependencies(依赖)会出现一个"babel-cli": "^6.26.0"(命令行工具,这一步还只能使用命令行工具,并不能进行转译),

4,安装转译依赖 npm install  --save-dev babel-preset-env(

  安装成功后,devDependencies(依赖)会出现一个"babel-preset-env": "^1.7.0"

5,在package.json中配置babel ,转译规则需要安装依赖 
  (npm install --save-dev babel-preset-es2015)

 

6,在命令行中调用babel,在package.json 中添加

 

7,编译es6代码,新建连个文件夹src 和 lib ,因为我们上面命令用的是 babel src -d lib,然后运行编译命令npm run build   就可以看到src 下面的文件被全部编译对应的放在lib文件夹下面,需要使用直接引入lib文件夹下面对应的文件

在项目中ES6语法转ES5语法 babel转码器的更多相关文章

  1. ES6转ES5(Babel转码器)

    ES6转ES5(Babel转码器) 前提:必须在VScode中已经安装了Node.js 官网:https://nodejs.org/en/ 一.安装命令行转码工具 npm install --glob ...

  2. Babel 转码器 § es6转换es5

    Babel 转码器 § es6转换es5 实时转码 /  Repl  -babel-node / babel-register(自动转码引入babel-register模块) 配置文件.babelrc ...

  3. ES6标准简介之Babel转码器解说

    ES6是ECMAScript 6的简称,是JavaScript语言的下一代标准,现在基于jquery库的前端开发js所使用的标准是ES5(ECMAScript 5).ES6已于2015年6月正式发布. ...

  4. ES6入门一:ES6简介及Babel转码器

    ES6简介 Babel转码器 Nodejs中使用ES6 WebPack中使用ES6及Babel转码插件 一.ES6简介与转码  1.1一个常见的问题,ECMAScript和JavaScript到底是什 ...

  5. 使用babel转码器,让浏览器支持es6语法

    ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,可是很多浏览器并不支持es6语法,所以我们需要一个转码工具, 把es6的语法转换成浏览器支持的javascr ...

  6. es6 babel转码器安装配置及常见命令

    示例:在d盘,新建文件夹es6,文件夹里新建一个文件es6.js. (1)先全局安装babel-cli,输入命令npm install babel-cli -g (2)输入d:( 进入d盘),再输入c ...

  7. 记项目中ES6+gulp+angularjs里的问题

    AngualrJs中可用来注入的有三种类型,service.factory.provider,这三种写法不样,用法也都不一样.其中,service只实例化一次,其实就是单例模式的思想.无论我们在什么地 ...

  8. webpackES6语法转ES5语法

    安装babel-loader: npm install --save-dev babel-loader@7 babel-core babel-preset-es2015 webpack.config. ...

  9. Vue项目中遇到的问题汇总

    一.打包后的打开index.html页面空白的几种情况: 引入的css.js路径报错,此时解决方法:把vue.config.js中的增加publicPath: ‘./’ 或者把原来的baseUrl改为 ...

随机推荐

  1. 略坑的C#自动回收机制

    说起这个坑货,要说说折腾了好久的bug,项目对方需要在32位系统上使用,C#加载图像扔给C++处理再返回.所以想好了,C#这边加载图像开好内存扔给C++,各自开的内存各自释放. 所以,在32位系统上出 ...

  2. R语言 plot()函数 基础用法

    plot(x=x轴数据,y=y轴数据,main="标题",sub="子标题",type="线型",xlab="x轴名称" ...

  3. ADLS_pppoe 基本设置过程

    ADLS_pppoe 设置: ①:开启接口的PPPoe功能——pppoe enable ②:指明接口是拨号池1的成员——pppo-client dial-pool-number ③:创建一个逻辑上的拨 ...

  4. 我的Java语言学习日志1_"简单的银行管理系统实现"

    设计步骤:注意:本篇代码,直接建两个类( Bank_Account.BankManage)在BankManage往里面填方法就行.是为了让和我一样自学朋友可以更快的接受.但是代码优化的空间还是很大的( ...

  5. 六十四、SAP中的内表的9种定义方式

    一.内表一共有9种定义方式,如下: 二.执行如下 *&--------------------------------------------------------------------- ...

  6. Flink Task 并行度

    并行的数据流 Flink程序由多个任务(转换/运算符,数据源和接收器)组成,Flink中的程序本质上是并行和分布式的. 在执行期间,流具有一个或多个流分区,并且每个operator具有一个或多个ope ...

  7. Bean XML 配置(2)- Bean作用域与生命周期回调方法配置

    系列教程 Spring 框架介绍 Spring 框架模块 Spring开发环境搭建(Eclipse) 创建一个简单的Spring应用 Spring 控制反转容器(Inversion of Contro ...

  8. Vue核心知识一览

    生命周期              beforeCreate :                 数据观测 和 初始化事件还未开始           created :                ...

  9. gdb 常用选项

    gdb 常用选项 help:查看命令帮助,具体命令查询在gdb中输入help + 命令,简写h run:重新开始运行文件(run-text:加载文本文件,run-bin:加载二进制文件),简写r st ...

  10. 如何生成 SSH keys, 并在 Github 或 Gitlab 等上添加密钥

    1 打开 Git Bash $ 2 输入 dir, 确认当前文件夹,并切换到想存密钥文件即pub文件的路径 $ dir 3 生成 密钥命令 ssh-keygen -t rsa -C "{ y ...