这个是解析我们es6的代码的,为什么要用它呢,因为对于一些ie浏览器,甚至FF浏览器,低版本的还不能识别我们的es6代码,那么vue里面好多还让我们去写es6的代码,这个时候我们就可以用babel这个工具将我们的es6的代码转译成浏览器能识别的代码

左边是我们写的es6代码,右边是通过babel这个工具编译之后的代码。这个代码能在我们各个浏览器中去识别。

所以我们成为babel,是用于编写下一代JavaScript的编译器。

模块化

在前端中一个js文件就是一个模块,在js中没有模块化的概念。

目前有四种模块化的方法

1.Commonjs

2.AMD

3.CMD

4.ES6Module

es6Module 支持import和export。跟python的import很像。但它必须在服务器环境下才支持,或者我们可能通过webpack的babel-loader将es6支持转化成es6的语言。

在这里就不给大家演示,大家了解一下即可。后面咱们使用vue开启项目之后,一使用,自然而然就明白了。

09-babel的更多相关文章

  1. Windows7WithSP1/TeamFoundationServer2012update4/SQLServer2012

    [Info   @09:03:33.737] ====================================================================[Info   @ ...

  2. 学习 React(jsx语法) + es2015 + babel + webpack

    视频学习地址: http://www.jtthink.com/course/play/575 官方地址 https://facebook.github.io/react/ 神坑: 1.每次this.s ...

  3. Sublime插件支持Sass编译和Babel解析ES6 & .sublime-build文件初探

    用Sublime Text蛮久了,配置配来配去的,每次换电脑都得重头再配过,奈何人老了脑子不中用了,得好好整理一些,下次换电脑就有得参考了.. 同事说,他的WebStorm简直太方便,自身集成了很多方 ...

  4. webpack 3.X学习之Babel配置

    Babel是什么 Babel是一个编译JavaScript的平台,它的强大之处表现在可以通过编译帮你达到: 使用下一代的javascript(ES6,ES7,--)代码,即使当前浏览器没有完成支持: ...

  5. 理解Babel是如何编译JS代码的及理解抽象语法树(AST)

    Babel是如何编译JS代码的及理解抽象语法树(AST) 1. Babel的作用是?   很多浏览器目前还不支持ES6的代码,但是我们可以通过Babel将ES6的代码转译成ES5代码,让所有的浏览器都 ...

  6. babel配置

      首页 首页 首页 博客园 博客园 博客园 联系我 联系我 联系我 demo demo demo GitHub GitHub GitHub 管理 管理 管理 魔魔魔芋芋芋铃铃铃 [02]websto ...

  7. Sublime插件支持Sass编译和Babel解析ES6 & .sublime-build文件初探(转载自imwtr)

    原文请看:http://www.cnblogs.com/imwtr/p/6010550.html   用Sublime Text蛮久了,配置配来配去的,每次换电脑都得重头再配过,奈何人老了脑子不中用了 ...

  8. 【02】webstorm配置babel转换器+截图(by魔芋)

    [02]webstorm配置babel转换器+截图(by魔芋)   [02]魔芋的安装过程     01,配置babel.   02,用webstorm.注意webstorm的版本号.   03,使用 ...

  9. 【Babel】293- 初学 Babel 工作原理

    戳蓝字「前端技术优选」关注我们哦! 前言 babel Babel 对于前端开发者来说应该是很熟悉了,日常开发中基本上是离不开它的. 已经9102了,我们已经能够熟练地使用 es2015+ 的语法.但是 ...

  10. 前端工程师需要掌握的 Babel 知识

    在前端圈子里,对于 Babel,大家肯定都比较熟悉了.如果哪天少了它,对于前端工程师来说肯定是个噩梦.Babel 的工作原理是怎样的可能了解的人就不太多了.本文将主要介绍 Babel 的工作原理以及怎 ...

随机推荐

  1. Python 中的Duck Typing

    在学习Python的时候发现了鸭 子类型这个术语,听起来好像很有意思一样,所以把它记下来. 鸭子类型(Duck Typing)的名字来源于"鸭子测试": "当看到一只鸟走 ...

  2. 第八章 计时器(BEEPER1)

    *------------------------------------- BEEPER1.C -- Timer Demo Program No. (c) Charles Petzold, ---- ...

  3. Linux 小知识翻译 - 「如何成为 Linux 内核开发者」

    新年的开始,聊聊「怎么做才能成为Linux内核开发者」. Linux内核的开发都是由志愿开发者们完成的.他们并不属于某些特定的企业. 因此,你也有参加Linux内核开发的资格.不用说,卓越的编码技术以 ...

  4. May 29. 2018 Week 22nd Tuesday

    Nothing is more terrible than ignorance in action. 最可怕的事情莫过于无知而行动. In today's digital age, we can ru ...

  5. IntelliJ IDEA LicenseServer激活及使用

    一.激活 IntelliJ IDEA下载地址:https://www.jetbrains.com/idea/download/#section=windows 原文地址:http://blog.csd ...

  6. java实现随机四则运算

    使用JAVA编程语言,独立完成一个包含3到5个数字的四则运算练习,软件基本功能要求如下: 程序可接收一个输入参数n,然后随机产生n道加减乘除练习题,每个数字在 0 和 100 之间,运算符在3个到5个 ...

  7. IPS简单使用方法

    转载:http://blog.csdn.net/zhou1862324/article/details/17512191 IPS(incident packaging service)是11G的新特性 ...

  8. 【ES6】=>含义

    =>是es6语法中的arrow function (x) => x + 6 相当于 function(x){ return x + 6; }; var ids = this.sels.ma ...

  9. GT--记录android app消耗的cpu/内存/流量/电量

    腾讯GT简介: 此apk是一款可以对APP进行测试的软件,可以在任何情况下快速测试手机app的CPU.内存.流量.电量.帧率/流畅度等性能测试.有安卓版本和ios版本,分别下载 1.下载腾讯GT ht ...

  10. Consumer group理解深入

    每一个consumer实例都属于一个consumer group,每一条消息只会被同一个consumer group里的一个consumer实例消费.(不同consumer group可以同时消费同一 ...