jsx文件需要先编译吗

❶ 最新react弃用了jsxtransformer了那jsx还能用吗

最新react弃用了jsxtransformer了那jsx还能用
这个确实是网络就能解决的问题 补充下楼上的回答
在react 0.14前，浏览器端实现对jsx的编译依赖jsxtransformer.js
在react 0.14后，这个依赖的库改为browser.js
页面script标签的type也由text/jsx改为text/babel
但是以上只能用来测试学习react
生产环境需要借助编译工具事先将jsx编译成js
对应的这个工具也由react-tool更换为babel

❷ jsx是javascript的一种语法扩展吗

对的，JSX就是Javascript和XML结合的一种格式。React发明了JSX，利用HTML语法来创建虚拟DOM。当遇到<，JSX就当HTML解析，遇到{就当JavaScript解析。

如下(JS写法)

varchild1=React.createElement('li',null,'FirstTextContent');
varchild2=React.createElement('li',null,'SecondTextContent');
varroot=React.createElement('ul',{className:'my-list'},child1,child2);

等价于(JSX写法)

varroot=(
<ulclassName="my-list">
<li>FirstTextContent</li>
<li>SecondTextContent</li>
</ul>
);

后者将XML语法直接加入JS中,通过代码而非模板来高效的定义界面。之后JSX通过翻译器转换为纯JS再由浏览器执行。在实际开发中，JSX在产品打包阶段都已经编译成纯JavaScript，JSX的语法不会带来任何性能影响。另外，由于JSX只是一种语法，因此JavaScript的关键字class, for等也不能出现在XML中，而要如例子中所示，使用className, htmlFor代替，这和原生DOM在JavaScript中的创建也是一致的。JSX只是创建虚拟DOM的一种语法格式而已,除了用JSX,我们也可以用JS代码来创建虚拟DOM。

❸ 如何使用react-tools将jsx编译成JavaScript

1,通过npm安装react-tools
npm –g react-tools
2,通过cmd进入项目根目录执行watch命令 jsx --watch src/ build/
src路径下存放的是jsx文件，编译后的js存放到build路径下
3,当目标文件变化以后，自动构建生成新的js文件。

❹ 如何用 Bower 编译 jsx

1.安装node，因为ts的编译器是js/ts写的； 安装node后同时获得npm命令，这是nodejs世界里的包管理器（也可以看作node的app商店）； 2.安装vs 2015或者vs code，当然这不是必须的，但是这里强烈推荐写ts的工具，vs第一，vsc第二； 3.vs自带了Type...

❺ 怎么在html5中直接编译jsx

/newscodejs.asp?lm2=84&list=5&icon=/img/fk.gif&tj=0&font=9&hot=0&new=0&line=0&lmname=0&open=1&n=36&more=0&t=0&week=0&zzly=0&hit=0&pls=0
这个文件显示的结果必须是js格式
如输出<img src="1.jpg" />
需要写成
document.write("<img src=\"1.jpg\" />")

❻ JavaScript在网页中执行需要先编译成可执行文件对吗为什么

JavaScript是脚本语言，由解释器解释执行，不算编译。所以这句话不对
JavaScript也可以看成过程语言，顺序执行。

❼ 原来Babel 能直接编译 JSX.官方用的是哪个

习惯了WebStorm的话..我就假设题主会用Node.js和npm啦～一句话总结：用WebStorm自带的FileWatcher功能+Babel实现自动转换ECMAScript6代码为ES5代码我是这么配置的..就先新建一个EmptyProject，然后在src目录下新建了一个main.js；//这一步不是必须的只是刚上手的话从空项目开始自己配置会少很多干扰Then..进入设置，把JavaScriptlanguageversion改成ECMAScript6；再Then..写一段ES6代码'usestrict';//node直接运行ES6代码时，如使用了ES6的一些关键字，比如let，就需要严格模式，否则会报错//这是没有严格模式时候的错误提示//SyntaxError:Block-scopeddeclarations(let,const,function,class)*fibs(){//GeneratorFunctionleta=0;letb=1;while(true){yielda;//[a,b]=[b,a+b];b=a+b;a=b-a;}}let[first,second,third,fourth,fifth,sixth]=fibs();console.log(first,second,third,fourth,fifth,sixth);现在IDE会出现一个Filewatcher提示条先别点Addwatcher！我们要先去装babel～首先在根目录新建一个package.json{"name":"test-project","version":"1.0.0"}然后打开IDE的Terminal，安装babel-clinpminstall--save-devbabel-cliGood!现在可以去点Addwatcher啦，点完之后会弹出一个框，其中大部分设置IDE都帮你搞定了下面第三行，Program那一项，填$ProjectFileDir$/node_moles/.bin/babel然后点OK，这个时候你就会发现左边多出来一个main-compiled.js文件啦但是还没搞定！现在只是搞定了自动转换的功能，系统默认把ES6compile成了ES6..（你应该会发现compile出来的东西跟原来的一样..Generator函数并没有被转换成ES5的格式）所以我们需要安装Babel的preset以正确识别ES6代码；和刚才一样，在npm安装babel的ES6的presetnpminstall--save-devbabel-preset-es2015在根目录下新建一个.babelrc文件（就是babel在当前项目的配置文件），写上{"presets":["es2015"]}OK搞定！保存再回去看一下main-compiled.js应该就变成这个样子啦，现在你在main.js里直接写ES6代码，IDE都会自动compile成ES5的代码在这里啦～注意：想直接用Node.js运行ES6代码还是有些问题..因为这段代码用的ES6的解构赋值Node.js还未完全支持，需要在运行的时候加入一些tags（以开启Node.js的相关试验特性），具体可以参考Node.js官网对ES6的说明：ECMAScript2015(ES6)。

❽ 如何使用react-tools将jsx编译成JavaScript

1,通过npm安装react-tools
npm –g react-tools
2,通过cmd进入项目根目录执行watch命令 jsx --watch src/ build/
src路径下存放的是jsx文件，编译后的js存放到build路径下
3,当目标文件变化以后，自动构建生成新的js文件。

❾ jsx文件如何是什么

JSX 文件，即带有扩展的 JavaScript。其中可包含处理 XML 的 ECMAScript（过去称为 JavaScript）。JSX 文件中的功能由 Web Service 进行 XML 映射时调用。WebLogic Workshop 扩展了 ECMAScript 语言，支持将 XML 作为本机类型，从而可以在脚本中直接处理 XML。