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. 【web安全】第一弹：利用xss注入获取cookie

    首先一定要先来吐槽一下tipask系统.这是一枚开源的类似百度知道的系统,但是漏洞多多,最基本的XSS注入都无法防御. 言归正传: [准备1] cookie接收服务器. 平时喜欢用sae,所以在sae ...

  2. Map集合的四种遍历

    Map集合遍历 Map<String,Integer> m = new HashMap<String,Integer>(); m.put("one",100 ...

  3. 转:我们是否应该把后端构建为API

    原文来自于:http://www.infoq.com/cn/news/2015/07/api-or-not 不久前,在StackExchange网站上,一位名为SLC的用户提起他正在设计一个ASP.N ...

  4. 第 11 章 桥梁模式【Bridge Pattern】

    以下内容出自:<<24种设计模式介绍与6大设计原则>> 今天我要说说我自己,梦想中的我自己,我身价过亿,有两个大公司,一个是房地产公司,一个是服装制造业,这两个公司都很赚钱,天 ...

  5. Java多线程初学者指南（11）：使用Synchronized块同步方法

    synchronized关键字有两种用法.第一种就是在<使用Synchronized关键字同步类方法>一文中所介绍的直接用在方法的定义中.另外一种就是synchronized块.我们不仅可 ...

  6. PHP错误Warning: Cannot modify header information - headers already sent by解决方法

    这篇文章主要介绍了PHP错误Warning: Cannot modify header information - headers already sent by解决方法,需要的朋友可以参考下 今天在 ...

  7. smarty 比较运算符对照表

    smarty 比较运算符对照表  运算符 中文解释 eq 相等 ne.neq 不相等 gt 大于 lt 小于 gte.ge 大于等于 lte.le 小于等于 not 非 mod 求模 is [not] ...

  8. Mongodb与关系型数据库

    MongoDB没有固定的关系约束 没有事务, 安全性不高 不一定保证数据的一致性. ACID不符合 NoSQL 放弃了传统关系型数据库严格的事务一致性和范式约束,采用弱一致性模型. http://os ...

  9. PowerDesigner从SqlServer 数据库中导入实体模型

    此篇是之前写的,从我的CSDN博客挖过来的- 一.开启数据库服务并配置ODBC数据源 1.开启数据库服务 (1)通过SQL Server Configuration Manager配置工具启动SQL ...

  10. 17.1.1.5 Creating a Data Snapshot Using mysqldump

    一种方式创建一个数据库的快照在一个存在的master 数据库是使用mysqldump 来创建你需要复制的所有数据库的dump. 一旦数据dump 是完成,你然后倒入数据到slave 在开始复制过程前 ...