1.JSX是什么
JSX其实是JavaScript的扩展,React为了代码的可读性更方便地创建虚拟DOM等原因,加入了一些类似XML的语法的扩展。

2.编译器——jsxTransformer
JSX代码并不能直接运行,需要将它编译成正常的JavaScript表达式才能运行,jsxTransformer.js就是这一编译器的角色。

3.第二代编译器——babel
React官方博客发布了一篇文章,声明其自身用于JSX语法解析的编译器JSTransform已经过期,不再维护,React JS和React Native已经全部采用第三方Babel的JSX编译器实现。原因是两者在功能上已经完全重复,而Babel作为专门的JavaScript语法编译工具,提供了更为强大的功能。而browser.js是babel编译器的浏览器版本

react编译器jsxTransformer,babel的更多相关文章

  1. webpack打包调试react并使用babel编译jsx配置方法

    http://lxj8749.iteye.com/blog/2287074 ********************************************** 安装webpack npm i ...

  2. es6编译器(babel搭建)

    1.安装Node.js,初始化项目 npm init -y 2.安装babel-cli(兼容至ie7) npm i @babel/core @babel/cli @babel/preset-env - ...

  3. 《前端之路》之 Babel 下一代 JavaScript 语法编译器

    写本章的内容的出发点主要是 为了对于之前关于 JS 版本的一个总结,在之前的开发中,我们始终对于 ECMAScript 的版本的更新不够重视,以至于在后面的 开发过程中,我们始终会被各种新奇的语法打断 ...

  4. 详解 Webpack+Babel+React 开发环境的搭建

    1.认识Webpack 构建应用前我们先来了解一下Webpack, Webpack是一个模块打包工具,能够把各种文件(例如:ReactJS.Babel.Coffeescript.Less/Sass等) ...

  5. React开发环境搭建(react,babel,webpack webpack-dev-server)

    最终效果: 配置webpack 自动编译脚本, 内容更改后浏览器页面自动刷新,提高效率. 主要靠webpack 的watch 功能. npm 全局安装的包: webpack webpack-cli w ...

  6. React: 认识React

    一.简介 React-Native是Facebook开源的跨平台框架,用于实现前端和原生进行混合开发.React-Native开发可以很好的使用原生UI构建用户界面,与传统的使用WebView相比,不 ...

  7. 为什么说Babel将推动JavaScript的发展

    Babel是一个转换编译器,它能将ES6转换成可以在浏览器中运行的代码.Babel由来自澳大利亚的开发者Sebastian McKenzie创建.他的目标是使Babel可以处理ES6的所有新语法,并为 ...

  8. React学习笔记(一) 基础知识

    现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了我. React的基 ...

  9. Babel 入门指南

    Babel 入门指南 ​⚠️ 注意: Babel 可以与很多构建工具(如 Browserify.Grunt.Gulp 等)进行集成.由于本教程选择 Webpack ,所以只讲解与 Webpack 的集 ...

随机推荐

  1. 在Windows上一键编译各种版本的Protobuf

    所需工具 : cmake  for  windows 和  git for windows 原理:protobuf 是google的一个开源项目,其源代码在github上可以下载到,并且源码都采用cm ...

  2. cdecl和stdcall调用约定-汇编演示

    . .model flat, stdcall .stack ExitProcess PROTO, dwExitCode:DWORD .data val2 sdword result dword ? . ...

  3. Moogoose操作之Schema实现增删查改

    Schema不仅定义了文档结构和使用性能,可以为后面的Model和Entity提供公共的属性和方法. Schema.Model.Entity的关系: Schema : 可以定义字段类型,不具备数据库的 ...

  4. Cocos2d-JS替换初始化场景

    Cocos2d-js工程默认启动入口为app.js,准备修改为另外一个入口文件如:GameScene.js var GameLayer = cc.Layer.extend({ ctor:functio ...

  5. <q>标签,短文本引用;<blockquote>标签,长文本引用

    <q>标签,短文本引用 <q>引用文本</q>,默认显示双引号,不需要在文本中添加 <blockquote>标签,长文本引用 浏览器对<block ...

  6. 强调语气<strong>和<em>标签,文字设置单独样式<span>

    区别:1,<em> 表示强调,<strong> 表示更强烈的强调. 2,并且在浏览器中<em> 默认用斜体表示,<strong> 用粗体表示. 3,两个 ...

  7. WebMethod属性详解

    WebMethod有6个属性:.Description.EnableSession.MessageName.TransactionOption.CacheDuration.BufferResponse ...

  8. 371. Sum of Two Integers

    不用加减法计算两个整数的和.这道题其实是考察一些基本的布尔代数知识.我们知道,二进制表示时: 0 + 0 = 00 1 + 0 = 01 0 + 1 = 01 1 + 1 = 10 所以,两个二进制整 ...

  9. Fiddler-007-修改HTTP请求响应数据

    前文简述了如何通过 Fiddler 修改 HTTP请求 的请求参数,详情请参阅:Fiddler-006-修改HTTP请求参数. 在进行 App 测试时,经常需要修改请求参数,以获得不同的显示效果,以查 ...

  10. asp.net mvc视图中嵌套分部视图

    asp.net mvc中Layout相当于webForm中母版页,分部视图相当于webForm中的用户控件. 下面例子是一个视图如何嵌套分部视图: A是分部视图,B是一般视图(A,B中的代码省略) 我 ...