对着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. perl 如何匹配ASCII码以及ASCII码转换

    匹配ASCII码:   /[:ascii:]/ ASCII码转换为数字: ord() 数字转换为ASCII码: chr()

  2. axis2+struts拦截地址冲突问题

    axis2和struts在整合过程中,struts会把axis的地址也拦截了,默认当成一个action处理, 会因为找不到action而报错: <!-- struts配置 --> < ...

  3. Google C++单元测试框架GoogleTest---GMock的CheatSheet文档

    CheatSheet文档中包含了GMock所有常用的东西,看了这个基本上就可以用它了,本文接上篇博文:Google C++单元测试框架GoogleTest---Google Mock简介--概念及基础 ...

  4. http参数的封装(后台接受参数的场景)

    场景 不管是任何web框架作为一个web的开发人员必须要搞明白control层如何接受各种参数. 下面就根据我们公司的系统架构(nutz)来进行一下场景描述.各位小伙伴也可以根据这些 场景自己去总结一 ...

  5. linux基础:第三关课前考试题整理

    1.如何取得/etc/hosts 文件的权限对应的数字内容,如-rw-r--r-- 为 644, 要求使用命令取得644 这样的数字. [root@server ~]# stat /etc/hosts ...

  6. 树莓派3B初始化后一些必须的设置

    接上一篇,SSH已经登录成功(http://www.cnblogs.com/crosys/p/6220108.html) 1.树莓派系统的设置 1.1扩展系统空间 因为内存卡还有很多空间没有分配,第一 ...

  7. WPF 自定义列表筛选 自定义TreeView模板 自定义ListBox模板

    有很多项目,都有数据筛选的操作.下面提供一个案例,给大家做参考. 左侧是数据源,搜索框加TreeView控件,右侧是ListBox控件.在左侧数据列点击添加数据,然后点击确定,得到所筛选的数据. 下面 ...

  8. sqlserver 连接不同服务器,不同实例

    SELECT   *FROM OPENDATASOURCE(         'SQLOLEDB',         'Data Source=ServerName;User ID=MyUID;Pas ...

  9. eclipse调试java程序的九个技巧

    转:http://www.cnblogs.com/lingiu/p/3802391.html 九个技巧: 逻辑结构 条件debug 异常断点 单步过滤 跳到帧 Inspect expressions ...

  10. Coursera上一个不错的Java课

    地址:https://www.coursera.org/learn/java-chengxu-sheji/home/welcome 复习天昏地暗,看点视频调剂一下.发现这个讲的还是很不错的.北大毕竟比 ...