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. pyramid的第一个项目

    1,安装pyramid --在次之前最好先安装python virtualenv --python virtualenv ---激活方式pyenv activate pip install pyram ...

  2. SimpleMembership: The future of membership for ASP.NET

    http://weblogs.asp.net/jgalloway/archive/2012/08/29/simplemembership-membership-providers-universal- ...

  3. sublime搭建c++/java/lua/python/ruby的配置文件

    本人电脑win7 64位 提前装一下convert to utf-8插件,编译运行出现乱码,组合键ctrl+shift+c把源文件转成gbk编码. 仍乱码的话,重启编辑器|电脑|重新编辑中文部分. c ...

  4. 可爱的PYTHON，更新到0.5版本代码

    这书看得挺顺的. 按着思路学习软件开发的主流思想.. cdctools.py # _*_ coding: utf-8 _*_ import os,sys def cdWalker(CDROM, cdc ...

  5. EasyUI datagrid数据表格的函数getData返回来的是什么

    EasyUI datagrid数据表格的函数getData返回来的是什么? 他返回来的是这么一个对象: Object { rows=[10], total=15} 其中rows就是每一行的数据,是这些 ...

  6. POJ_1220_Nmber Sequence

    上网查了一下进制转换的算法,发现一个性能比较好的:m进制转换成n进制,先用例如62进制ABC转换成10进制,就是用余位c(第一个数余位数值为0)乘以原基数from,加上A表示的数值,然后得到一个数,对 ...

  7. [置顶] linux内核启动1-启动参数（启动参数的获取和处理，分析setup_arch）

    最近公司要求调试一个内核,启动时有问题,所以就花了一点时间看看内核启动. 看的过程中总结了一点东西,希望可以帮助大家调试内核. 当我开始看的时候,第一件事是从网上搜集资料,不看不知道,一看吓一跳!牛人 ...

  8. 当函数没有return时错误

    error:control reaches end of non-void function 在对应函数+return   :  即可

  9. Python正则匹配多行，多个数据

    最近用Python做一个crawler工具的时候,发现用一个正则表达式可以匹配到个数据的时候用match.group()只能打印出第一个数据,其它数据不能打印出来.最后找到解决方法,现在记录一下,直接 ...

  10. POJ_3111_K_Best_(二分,最大化平均值)

    描述 http://poj.org/problem?id=3111 n个珠宝,第i个有价值v[i]和重量w[i],要从总选k个,使得这k个的(价值之和)/(重量之和)即平均价值最大,输出选中的珠宝编号 ...