使用babel插件集
1).打开配置文件".babelrc",配置插件集,代码如下:
{
"presets":["latest"]
}
2).安装babel插件集,打开命令窗口,输入如下命令:
npm install babel-preset-latest
3).开发者需要注意的是,babel只对ES6的新语法进行转码,不会转换成新的API,比如不支持转码Object.assign函数,如果开发中用到的新的API,可以使用babel-polyfill添加垫片。安装垫片代码如下,
npm install babel-polyfill
4).安装成功之后,在入口脚本文件头部加入垫片,代码如下
import “babel-polyfill”;
5).如果在Node.js环境里运行javascript文件,除了可以使用命令在运行前进行转码外,也可以使用钩子在运行时进行转码,创建server.js 文件,输入如下代码
import "http"
console.log("Hello world");
6).打开命令窗口,输入命令,运行server.js,命令如下:
node server.js
因为Node.js 不支持es6的important语法,会出现报错信息"Unexpected token import".
7).打开命令行窗口,安装钩子,命令如下:
npm install babel-register
8).创建hook.js 文件,注册钩子,代码如下:
require("babel-register");
require("./server");
9).运行钩子文件,打开命令行窗口,输入如下命令:
node hook.js
成功打印信息 "Hello World"
BABEL官网提供了一个在线转换的页面https://babeljs.io/repl/,可以实时查看es6转码成es5的格式,还可以配置不同的插件以及插件集,对学习es6以及babel非常有帮助。
使用babel插件集的更多相关文章
- 纯js客服插件集qq、旺旺、skype、百度hi、msn
原文 纯js客服插件集qq.旺旺.skype.百度hi.msn 客服插件,集qq.旺旺.skype.百度hi.msn 等 即时通讯工具,并可自己添加支持的通讯工具,极简主义,用法自己琢磨.我的博客 h ...
- [转] 以 async/await 为例,说明 babel 插件怎么搭
你一定碰到过这些库 babel-polyfill 项目地址:https://github.com/babel/babel/blob/master/packages/babel-polyfill 通过两 ...
- 从AST编译解析谈到写babel插件
之前一直在掘金上看到一些关于面试写babel插件的文章,最近也在学,以下就是学习后的总结. 关键词:AST编译解析, babel AST编译解析 AST[维基百科]:在计算机科学中,抽象语法树(Abs ...
- 开发一个简单的babel插件
前言 对于前端开发而言,babel肯定是再熟悉不过了,工作中肯定会用到.除了用作转换es6和jsx的工具之外,个人感觉babel基于抽象语法树的插件机制,给我们提供了更多的可能.关于babel相关概念 ...
- Xcode 插件集:xTextHandler
本文转载至 http://www.tuicool.com/articles/zIFvQn7 基于 Xcode Source Editor Extension 做了一个插件集,叫做 xTextHandl ...
- 快速写一个babel插件
es6/7/8的出现,给我们带来了很多方便,但是浏览器并不怎么支持,目前chrome应该是支持率最高的,所以为了兼容我们只能把代码转成es5,这应该算是我们最初使用babel的一个缘由,随着业务的开发 ...
- (6)webpack使用babel插件的使用
为什么要使用babel插件? 首先要了解babel插件是干嘛的,随着js的语法规范发展,出现了越来越多的高级语法,但是使用webpack打包的时候,webpack并不能全部理解这些高级语法,需要我们使 ...
- (数据科学学习手札95)elyra——jupyter lab平台最强插件集
本文示例文件已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 jupyter lab是我最喜欢的编辑器,在过往 ...
- ThreeJS系列2_effect插件集简介( 3d, vr等 )
ThreeJS系列2_effect插件集简介( 3d, vr等 ) ThreeJS 官方案例中有一些 js库 可以替代 render 将场景中的物质变换为其他效果的物质 目录 ThreeJS系列2_e ...
随机推荐
- 131.006 Unsupervised Learning - Feature Scaling | 非监督学习 - 特征缩放
@(131 - Machine Learning | 机器学习) 1 Feature Scaling transforms features to have range [0,1] according ...
- CentOS 7 Apache 多端口部署 Web Apps 指南
转载自简书,原作者xuyan0,链接https://www.jianshu.com/p/b34c78bf9bf0,如有侵权,请联系删除 导语 Apache web 服务器运行着互联网上超过半数的活跃的 ...
- CoolViewPager:即刻刷新,自定义边缘效果颜色,双向自动循环,内置垂直切换效果,想要的都在这里
这两天在GitHub上传了一个自定义ViewPager:CoolViewPager,具有以下功能特征: 支持水平及垂直方向循环滚动 支持自动滚动 支持自动滚动方向.滚动时间.间隔时间的设置 支持调用n ...
- IEC62304软件维护框架
软件维护计划的任务 建立接收.记录.评估.解决和追踪医疗器械软件发行后的反馈 制定确认反馈是否是问题的标准 使用风险管理过程 使用配置管理过程 制定升级.补丁以及遗留问题修正计划 问题和修改分析的任务 ...
- Anjular中的路由配置以及服务等模块的一些基本操作
1.路由的配置: 在Angular.js中,我们可以根据自己的需求来配置路由,以达到当url中的地址改变时,会跳转不同的页面 <script> //一开始的url:"http:/ ...
- GIT:如何管理本机的多个ssh密钥(多个远程仓库账号)
最近在学习git,首先推荐一个个人认为很不错的git教程,学习后,从git新手变成了git入门了,仍需继续努力. 廖老师的git学习教程(其他git基础知识点,本篇博客就不做介绍了,自己看教程学习吧, ...
- 毕向东_Java基础视频教程第19天_IO流(20~22)
第19天-20-IO流(改变标准输入输出设备) static void setIn(InputStream in) Reassigns the "standard" input s ...
- Bootstrap 4/3 页面基础模板 与 兼容旧版本浏览器
Bootstrap 3 与 4 差别很大,目录文件结构.所引入的内容也不同,这里说说一下 Bootstrap 引入的文件.网页模板和兼容性问题.本网站刚刚搭建好,正好发一下文章原来测试网站. Boot ...
- extern “C”
http://www.cnblogs.com/yc_sunniwell/archive/2010/07/14/1777431.html 问题:extern “C” 在C++环境下使用C函数的时候,常常 ...
- 使用Qt框架开发http服务器问题的记录
最近需求需要开发一款 HTTP ,然后由于先前接触过Qt,就直接用Qt写HTTP服务器了,也是为了当作练手,要不然是直接上HTTP框架的. 后端用C++ Qt框架 前端为了练手 当然是纯生的 js h ...