The JSX Transformer library is not recommended for production use. Instead, you'll probably want to precompile your JSX into JavaScript.

Install:

npm install react-tools -g

Run:

jsx dev build --no-cache-dir --watch

//watch dev dir and compile js to build dir

You also need to change html a little bit:

dev/index.html

<!doctype html>

<html lang="en">

<head>

    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

    <link rel="stylesheet" href="style.css"/>

    <script src="//fb.me/react-0.13.3.js"></script>

    <script src="//fb.me/JSXTransformer-0.13.3.js"></script>

    <meta charset="utf-8">

    <title>Compiler Dev</title>

</head>

<body>

<script  type="text/jsx" src="app.js"></script>

</body>

</html>

build/index.html

<!doctype html>

<html lang="en">

<head>

    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

    <link rel="stylesheet" href="style.css"/>

    <script src="//fb.me/react-0.13.3.js"></script>

    <!-- no jsx file included-->

    <meta charset="utf-8">

    <title>Compiler Dev</title>

</head>

<body>

<!-- no type="jsx/text" -->

<script src="app.js"></script>

</body>

</html>

[React] React Fundamentals: Precompile JSX的更多相关文章

  1. [React] React Fundamentals: Integrating Components with D3 and AngularJS

    Since React is only interested in the V (view) of MVC, it plays well with other toolkits and framewo ...

  2. React报错之JSX element type does not have any construct or call signatures

    正文从这开始~ 总览 当我们试图将元素或react组件作为属性传递给另一个组件,但是属性的类型声明错误时,会产生"JSX element type does not have any con ...

  3. [React] react+redux+router+webpack+antd环境搭建一版

    好久之前搭建的一个react执行环境,受历史影响是webpack3.10.0和webpack-dev-server2.7.1的环境,新项目准备用webpack4重新弄弄了,旧的记录就合并发布了(在没有 ...

  4. React: React组件创建的三种方式

    一.简介 在前面介绍的React组件知识中,对于组件的创建我只是用了其中某一种方式.其实,在2013年React诞生之初,对于React组件的创建,仅仅只有一种方式,也即createClass函数,在 ...

  5. React/react相关小结

    React React组件由React元素组成,React组件使用React.Component或React.PureComponent来生成:React元素使用JSX的语法来编写或使用React.c ...

  6. React/React Native 的ES5 ES6写法对照表

    //es6与es5的区别很多React/React Native的初学者都被ES6的问题迷惑:各路大神都建议我们直接学习ES6的语法(class Foo extends React.Component ...

  7. React/React Native 的ES5 ES6写法对照表－b

    很多React/React Native的初学者都被ES6的问题迷惑:各路大神都建议我们直接学习ES6的语法(class Foo extends React.Component),然而网上搜到的很多教 ...

  8. React: React组件的生命周期

    一.简介 在前面的第二篇博文中对组件的生命周期虽然做了一个大略介绍,但总感觉说的过于简单,毕竟生命周期是React组件的核心部分.在我们熟练使用React挂载和合成组件来创建应用表现层的过程中,针对数 ...

  9. React: React的属性验证机制

    一.简介 在开发中,属性变量类型的验证,几乎是任何语言都必须关注的问题,因为如果传入的数据类型不对,轻者程序运行仅仅是给出警告⚠️,严重的会直接导致程序中断,APP闪退或者web页面挂掉,这是很严重的 ...

随机推荐

  1. Java Fx-安装E(FX)CLIPSE IDE

    安装E(FX)CLIPSE IDE 本文主要介绍如何在Eclipse Mars 4.5.0版本上安装e(fx)clipse. 本文中的介绍和截图使用了纯净安装的为RCP和RAP开发者准备的Eclips ...

  2. 关于django Models的个人理解和related_name的使用

    作为一个新人(刚刚大学还没有毕业就出来实习,可以说是真的什么都不知到,什么都要重新学,但是这样真的可以锻炼自己的意志力和能力).现在在公 司是前端和后端一起坐,所以要学的东西是真的多的让人想不到.在学 ...

  3. 把内表 itab1 的 n1 到 n2 行内容附加到 itab2 内表中去.

    语法:append lines of itab1 [ from n1 ] [ to n2 ] to itab2. DATA:BEGIN OF gt_00 OCCURS 0,        l_01   ...

  4. NWERC 2012 Problem A Admiral

    一个最小费用最大流的简单建模题: 比赛的时候和小珺合力想到了这个题目的模型: 方法:拆点+边的容量为1 这样就可以保证他们不会在点上和边上相遇了! 感谢刘汝佳大神的模板,让我这个网络流的小白A了这个题 ...

  5. MIME

    http://www1.huachu.com.cn/read/readbookinfo.asp?sectionid=1000000558 http://www.jb51.net/hack/10623. ...

  6. android recovery模式及ROM制作

    转自android recovery模式及ROM制作 1.总述 为了方便客户日后的固件升级,本周研究了一下android的recovery模式.网上有不少这类的资料,但都比较繁杂,没有一个系统的介绍与 ...

  7. ruby面向对象class

    ruby对象是严格封装的:只能通过定义的方法访问其内部状态.方法使用的成员变量在对象外部不能直接访问,不过可以通过getter.setter等访问器方法(accessor),使他们看起来好像是直接访问 ...

  8. javascript外部使用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. SharePoint 2010中使用Visual Studio 2010进行方便快速的Web Part开发

    转:http://www.cnblogs.com/fatwhale/archive/2010/02/24/1672633.html 在Visual Studio 2010中,  已经集成了用于Shar ...

  10. （转载）PHP 判断常量,变量和函数是否存在

    (转载)http://www.jb51.net/article/17881.htm 如果你看懂了上面一句话,那么接下来都是废话,PHP手册写的还是很全的.一句话就把我标题中的问题全部解决了. 还是举几 ...