反應是不工作我的機器

上我下載陣營版本15和創建以下HTML文檔：反應是不工作我的機器

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="build/react.js"></script> 
    <script src="build/react-dom.js"></script> 
    </head> 
    <body> 
    <div id="container"></div> 
     <script type="text/jsx"> 
      // React Code Goes Here 

    var MyComponent = React.createClass({ 
      render: function(){ 
       return (<h1>Hello, {this.props.name}!</h1>); 
      } 
    }); 

    ReactDOM.render(
      <MyComponent name="world" />, 
      document.getElementById('container') 
    ); 


     </script> 
    </body> 
</html>

罰款jsfiddle但不是我的機器上同樣的作品。我想避免安裝React開發工具或任何額外的東西。是否有可能使它與我所擁有的或我需要安裝其他東西時完全相同的工作？

有噸教程在那裏，但他們似乎都失去了一些東西讓我開始

來源

2017-01-06 ElenaDBA

如果你確定你有一個在同一水平作爲所謂的build文件夾中react.js和react-dom.js文件html頁面，唯一缺少的是：

腳本包括爲了你能夠使用你的身體的腳本標籤有JSX代碼，將其添加到<head>標籤爲babeljs：

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.min.js"></script>

來源

2017-01-06 18:56:52 Pineda

是的，文件在那裏。下載並添加babel.js，它的工作！謝謝！ – ElenaDBA

好東西。就像@ jmar777所說的那樣，除了測試之外，任何東西都應該避免在前端像這樣發送babeljs。這足以讓你嘗試:) – Pineda

作爲一個先驅性聲明，我只想確保提及您可能不希望從JSX-> JS進行瀏覽器內部的轉換，而不是使用該技術進行其他任何操作。在生產環境中，您希望預編譯JSX服務器端或在生成步驟期間。

這就是說，其中存在你的問題：你試圖直接在瀏覽器代碼中包含JSX，而不包括任何東西來爲你做瀏覽器端編譯。

基於我所看到的，它看起來最新和最好的方法是現在使用<script type="text/babel">而不是<script type="text/jsx">，編譯是通過babel的browser.js完成的。

這裏本指南似乎大多最新：https://www.sitepoint.com/getting-started-react-jsx/

來源

2017-01-06 18:59:33 jmar777

我會說，如果你是剛開始反應過來，一個真正的好項目，看看會create-react-app。它通過一個簡單的設置完成所有的魔術

來源

2017-01-06 19:23:00

反應是不工作我的機器

回答

相關問題