reactjs - 笨蛋。如何需要一个react模块？

Question

我试图在 plnkr 上请求一个 React React 模块在 script.jsx 文件中使用:

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

这给出了“未定义需求”错误。

我想知道如何在 plnkr 上请求模块？

Answer 1

您没有使用任何捆绑程序，一切都在浏览器中，因此您必须首先在 index.html 中包含该 AptList 组件的脚本:

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

这已经包含了该组件的定义。您不需要(也不能)在那里使用 require。

在 AptList.js 中，您不需要 module.exports = AptList; 因为它已经使用上面的脚本标记导入。另外，您应该删除 script.jsx 中的 require。

现在，另一个大问题是您正在使用 JSX，浏览器本身不支持它。为此，您将需要 Babel，因此在 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.