Javascript Reactjs:组件未渲染_Javascript_Reactjs_Webpack

Javascript Reactjs:组件未渲染

javascript reactjs webpack

Javascript Reactjs:组件未渲染,javascript,reactjs,webpack,Javascript,Reactjs,Webpack,这很尴尬，但我正在浪费时间试图弄清楚为什么reactjs组件不渲染以下是我目前拥有的代码： // index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Ulonka Frontend</title> </head> <body> <div id="app"><

这很尴尬，但我正在浪费时间试图弄清楚为什么reactjs组件不渲染

以下是我目前拥有的代码：

// index.html 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Ulonka Frontend</title>
  </head>
  <body>
    <div id="app"></div>
    <script type="text/javascript" src="bundle.js" charset="utf-8"></script>
  </body>
</html>

在App.js的


import React from 'react' 
import { render } from 'react-dom' 
import { Router, Route, browserHistory, IndexRoute } from 'react-router' 
import App from './App'

render((
  <Router history={browserHistory}>
    <Route path="/" component={App}>
    </Route>
 </Router>
), document.getElementById('app')) 

import React from 'react' 
export default React.createClass({ 
  render() {
    return <div> <h1> Hello </h1> </div>
  } 
}) 

从“React”导入React
导出默认的React.createClass（{
render（）{
打招呼
} 
}) 

检查了开发工具中的源代码，可以在bundle.js中看到字符串“Hello”，但由于某些原因，它不会显示在浏览器中
有人能给我解释一下我错过了什么吗？非常感谢您的帮助。谢谢
 您在App.js
中使用了错误的语法：您要导出的类没有名称
因此，App.js
应该是
import React from 'react' 
const Hello = React.createClass({ 
  render() {
    return <div> <h1> Hello </h1> </div>
  } 
}) 
export default Hello;

从“React”导入React
const Hello=React.createClass（{
render（）{
打招呼
} 
}) 
导出默认Hello；

或者，ES6版本
import React from 'react' 
class Hello extends React.Component({ 
  render() {
    return <div> <h1> Hello </h1> </div>
  } 
}) 
export default Hello;

从“React”导入React
类Hello扩展了React.Component（{
render（）{
打招呼
} 
}) 
导出默认Hello；

检查，例如：
你的路线可能错了。您的代码在没有react路由器的情况下工作
。嗯，不完全是这样：在应用了正确的语法之后，它就可以工作了。检查
另外，routes.js
和App.js
是否在同一目录中？
render方法已移动到react包中。
试试这个
从“React”导入React，{render}
@乌尔索斯，@polkovinkov.ph，@TheReason
忘了指出我发现了我的错误
我的错误是将应用程序的根组件（app.js）设置为应用程序的入口点（index.js）。一旦这个错误被纠正，App.js就会呈现给DOM
谢谢你的一切；非常感谢。
您是否尝试过在不使用反应路线的情况下渲染它？文本/javascript
对于JS来说是错误的模拟类型，根据规范，它是应用程序/javascript
。因为没有一个健全的浏览器支持JS以外的语言，HTML5声称仅使用
用于此目的是安全的。为什么不
？@polkovnikov.ph:谢谢你的关注。改正了。还是没有骰子。也不要认为关闭下一行的
会导致问题；检查只是为了确定，但在浏览器中仍然看不到字符串hello。否则代码对我来说似乎完全有效。控制台中是否有任何消息？此外，React handles在渲染时以静默方式处理异常，在Chrome开发工具中启用“捕获异常的中断”之前，您甚至可能不会得到异常。这在导入整个包时是不必要的。我也注意到了这一点，但显然您可以拥有一个没有名称的“默认”组件。但不确定；“别在那件事上引用我的话。”克里斯很有趣。你能在这上面展示一下吗？不，但是看看这个@Chris你是对的，我用了这个语法。我不知道，谢谢。我会改变我的答案。