这个是解析我们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. java求解第N个素数(质数)

    面试中,遇到一个题目:求解第N个素数. import java.util.Scanner; public class GetPrimeNumber { public static int NthPri ...

  2. February 27th, 2018 Week 9th Tuesday

    Great minds think alike. 英雄所见略同. If great minds really did think alike, then we would live in an unr ...

  3. Go学习笔记06-内建容器

    Go学习笔记06-内建容器 Go语言 数组 *切片(Slice) #F44336 Slice的操作 Map map示例 字符处理 数组 定义数组: //这样定义数组编译器自动初始化每个元素为0  va ...

  4. 注册mySQL到JDBC驱动程序方法浅谈

    一.注册方法(4种) 1)服务提供者框架: 符合JDBC 4.0规范的驱动程序包含了一个文件META-INF/services/java.sql.Driver,在这个文件中提供了JDBC驱动实现的类名 ...

  5. C#基础知识之List和数组之间的转换

    1,从System.String[]转到List<System.String> System.String[] str={"str","string" ...

  6. (转)Spring Boot 2 (九):【重磅】Spring Boot 2.1.0 权威发布

    http://www.ityouknow.com/springboot/2018/11/03/spring-boot-2.1.html 如果这两天登录 https://start.spring.io/ ...

  7. 《程序员的自我修养》读书笔记——系统调用、API

        系统调用 程序运行的时候,本身是没有权限访问多少系统资源的.系统资源有限,如果操作系统不进行控制,那么各个程序难免会产生冲突.线程操作系统都将可能产生冲突的系统资源保护起来,阻止程序直接访问. ...

  8. Rancher2-----了解什么是rancher以及简单部署

    个人理解:就是相当于openstack的图形化界面,或者说应用程序的图形化界面,rancher功能就是在图形化界面去管理容器,包括运行容器,创建网络,存储等:rancher有个应用商店,可以根据自己的 ...

  9. P1024 一元三次方程求解(二分答案)

    思路: 求这个根,然后有一个关键的条件|x1-x2|>=1,然后就是从-100,枚举到+100,每次二分(i, i+1)注意如果f(i)*f(i+1)>0则不进行二分,如果,你觉得这样的值 ...

  10. Python中关于if __name__=='__main__'的问题

    先举一个简单的例子: 这里有两个.py的文件,a.py和b.py a.py内容为: b.py的内容为: 当执行b.py时结果为: 也就是将a.py文件里的内容执行一边,b.py里的内容执行一边,这显然 ...