添加ReactJS到香草JavaScript

我可以使用腳本標記簡單地將反應庫添加到我的html頁面嗎？添加ReactJS到香草JavaScript

在哪裏可以添加下面的代碼，以便執行？

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

來源

2017-04-06 Chaitanya

堆棧溢出具有像這樣的東西的文檔部分。 http://stackoverflow.com/documentation/reactjs/797/getting-started-with-react#t=201704061851145125693 –

是的，你可以，你需要添加的react，react-dom和babel在html頁面的引用，然後直接就把ReactJs部分內script標籤，用型script爲text/jsx的。

使用react，react-dom和babel這些參考：

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.24.0/babel.js"></script>

不要忘了加的babel的參考，這是需要transpile JSX代碼爲JavaScript。

提到腳本的類型爲text/jsx，否則babel將無法轉儲該部分。

檢查工作示例：

<html> 
 
    <head> 
 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.24.0/babel.js"></script> 
 
    </head> 
 
    <body> 
 
    <div id='root'/> 
 
    <script type='text/jsx'> 
 
     ReactDOM.render(
 
      <h1>Hello, worl151d!</h1>, 
 
      document.getElementById('root') 
 
     ); 
 
    </script> 
 
    
 
    </body> 
 
</html>

檢查這些詳細信息：

Babel，React。

來源

2017-04-06 18:50:33

是的，你可以。 Check out the docs here

它基本上說，你可以添加以下腳本標記您<head>：

<script src="https://unpkg.com/[email protected]/dist/react.js"></script> 
<script src="https://unpkg.com/[email protected]/dist/react-dom.js"></script>

請注意，爲了使用JSX，ES6，你必須包括一個transpiler like Babel太CDN腳本：

<script src="https://unpkg.com/[email protected]/babel.min.js"></script>

當你獲得一些動力在同一頁面提供了有關使用的軟件包管理器像npm或yarn設置你的項目的一些簡單的建議

來源

2017-04-06 18:47:51 Pineda

我安裝了npm。請告訴我如何幫助我的項目。我在哪裏寫我的代碼？ – Chaitanya

添加ReactJS到香草JavaScript

回答

相關問題