对着React官网的教程练习操作，在做到分离文件练习时，按照官网步骤来却怎么也无法正常显示HelloWord。

经测试，html文件中内容改为：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Hello React</title>
    <script src="../react-15.2.0/build/react.js"></script>
    <script src="../react-15.2.0/build/react-dom.js"></script>
  </head>
  <body>
   <div id="example"></div>
   <script  src="../build/helloword.js">  </script>
  </body>
</html>

分离出的jsx文件内容为：

ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('example')
);

利用   jsx --watch src/ build/ 编译后的js文件为：

ReactDOM.render(
  React.createElement("h1", null, "Hello, world!"),
  document.getElementById('example')
);

红色加粗为添加的内容。如此，即可显示HelloWord了。不明白为什么官网的例子我走不通，而我改这样就能走通了。有明白的可以告知我一下下~

---------------------------------------分割线------------------------------------

附文档目录树：

---------------------------------------分割线------------------------------------

---------------------------------------分割线------------------------------------

---------------------------------------分割线------------------------------------

---------------------------------------分割线------------------------------------

React.js 官网入门教程 分离文件 操作无法正常显示HelloWord的更多相关文章

  1. 转：asm.js 和 Emscripten 入门教程

    转:http://www.ruanyifeng.com/blog/2017/09/asmjs_emscripten.html asm.js 和 Emscripten 入门教程 作者: 阮一峰 日期:  ...

  2. htmlunit官网简易教程（翻译）

    1 环境搭建: 1)下载 从链接:http://sourceforge.net/projects/htmlunit/files/htmlunit/ 下载最新的bin文件 2)关于bin文件 里面主要包 ...

  3. 从unity3d官网下载教程

    http://unity3d.com/learn/tutorials/projects/tanks-tutorial 官网的教程提供的下载链接https://www.assetstore.unity3 ...

  4. Knockout.Js官网学习(系列)

    1.Knockout.Js官网学习(简介) 2.Knockout.Js官网学习(监控属性Observables) Knockout.Js官网学习(数组observable) 3.Knockout.Js ...

  5. dubbo系列一：dubbo介绍、dubbo架构、dubbo的官网入门使用demo

    一.dubbo介绍 Dubbo是阿里巴巴公司开源的一个高性能优秀的服务框架,使得应用可通过高性能的RPC实现服务的输出和输入功能,可以和Spring框架无缝集成.简单地说,dubbo是一个基于Spri ...

  6. Python爬虫与数据分析之进阶教程：文件操作、lambda表达式、递归、yield生成器

    专栏目录: Python爬虫与数据分析之python教学视频.python源码分享,python Python爬虫与数据分析之基础教程:Python的语法.字典.元组.列表 Python爬虫与数据分析 ...

  7. React官网首页demo(单文件实现版)

    本博客实现React官网首页上展示的demo, 为了方便直接采用单文件的形式, 如果想完整集成 在自己的项目中, 可以参考React官网的安装指南, 安装Create React App. hello ...

  8. React 最简单的入门教程

      一看就懂的ReactJs入门教程(精华版)   现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual D ...

  9. Knockout.Js官网学习（简介）

    前言 最近一段时间在网上经常看到关于Knockout.js文章,于是自己就到官网看了下,不过是英文的,自己果断搞不来,借用google翻译了一下.然后刚刚发现在建立asp.net mvc4.0的应用程 ...

随机推荐

  1. CodeSmith7 系列 破解教程

    CodeSmith[点此下载] 学过三层的人应该认识CodeSmith Generator吧,今天我就跟大家一起探讨下CodeSmith Generator 7.0.2的激活,这最新版本破解的难度也是 ...

  2. win10 安装visual studio 2015遇到的坑

    最近win7系统不知啥原因无法访问域中的网络文件,打算升级到win10体验一下.结果发现这一路有太多的坑.首先安装win10基本上算顺利,但是当进入系统后,菜单模式对于PC的鼠标来说,用起来感觉不顺手 ...

  3. windows 7 + virtualbox安装centos+mono+jexus

    1. 下载安装virtualbox和virtualbox extension 2. 创建并安装centos虚拟机 3. 下载并安装libgdiplus,gdi+库 4. 下载并安装Mono 5. 下载 ...

  4. 3D坦克大战游戏源码

    3D坦克大战游戏源码,该游戏是基于xcode 4.3,ios sdk 5.1开发.在xcode4.3.3上完美无报错.兼容ios4.3-ios6.0 ,一款ios平台上难得的3D坦克大战游戏源码,有2 ...

  5. 用gcc进行程序的编译

    在Linux系统上,一个档案能不能被执行看的是有没有可执行的那个权限(x),不过,Linux系统上真正认识的可执行文件其实是二进制文件(binary program),例如/usr/bin/passw ...

  6. vs2010中如何设置Visual Assist方便地使用现成的代码编辑器风格

    风格setting可以在下面网站上获取: http://studiostyl.es/ 在VS2010+VA直接使用会有2个显著的问题: 1,有些符号颜色太深,与黑色背景几乎融为一体: 2,光标落入大小 ...

  7. ubuntu 常见错误--Could not get lock /var/lib/dpkg/lock

    ubuntu 常见错误--Could not get lock /var/lib/dpkg/lock 通过终端安装程序sudo apt-get install xxx时出错:E: Could not ...

  8. Python测试函数的方法之一

    Python测试函数的方法之一 首先介绍简单的try......except尝试运行的放例如下面的图和代码来简单介绍下: 注释:提醒以下代码环境为2.7.x 请3.x以上的同学们老规矩print(把打 ...

  9. [iOS]技巧集锦：UITableView自定义Cell中的控件无法完全对齐Cell的左边界和右边界

    这是个很诡异的问题,由于一些特殊需求,我的TableView的Cell的背景色是透明,其中的控件会有背景色,第一个控件和最后一个控件我都用IB自动设了约束,对齐Cell的左边界和右边界,但是自动约束很 ...

  10. 【码在江湖】前端少侠的json故事（上）日月第一击

    日月第一击 这是我前端生涯第一次和后台对接,其经历真是苦不堪言,多次绝处逢生,柳暗花明,可就是迟迟见不到那条村子.当然,最后我还是完成了这次对接.下面来聊一聊我这白痴一般的经历. 序章 话说天下大势, ...