对着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了。不明白为什么官网的例子我走不通,而我改这样就能走通了。有明白的可以告知我一下下~
---------------------------------------分割线------------------------------------
附文档目录树:
---------------------------------------分割线------------------------------------
---------------------------------------分割线------------------------------------
---------------------------------------分割线------------------------------------
---------------------------------------分割线------------------------------------