Plunker。如何要求反應模塊？

Question

我試圖要求對plnkr在script.jsx文件中使用反應陣營模塊：

var AptList = require('./AptList'); 

這是給人一種「要求沒有定義」的錯誤。

我想知道如何在plnkr上需要模塊？

Answer 1

您不使用任何捆綁，一切都在瀏覽器中，所以你必須首先包括用於AptList組件腳本在index.html：

<script src="AptList.js"></script> 
<script src="script.jsx"></script> 

這將已經包括了定義零件。你不需要（也不能）在那裏使用require。

在AptList.js中，您不需要有module.exports = AptList;，因爲它已經使用上面的腳本標記導入了。另外，您應該刪除script.jsx中的require。

現在，另一個大問題是您正在使用JSX，這不受瀏覽器本機支持。對於這一點，你需要通天，所以index.html中添加下面的腳本：

<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script> 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react.js"></script> 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react-dom.js"></script> 

然後，您有以下型在底部添加到每個腳本標籤，身體年底前：

<script type="text/babel" src="..."></script> 

這將允許您使用ES6語法和JSX。

Here is the link to the plunk with everything working.