笨蛋。如何要求反应模块?
Plunker . How to require a react module?
我正在尝试在 script.jsx 文件中的 plnkr 上使用 React React 模块:
var AptList = require('./AptList');
这是一个 "require is not defined" 错误。
我想知道如何在 plnkr 上要求模块?
您没有使用任何捆绑器,一切都在浏览器中,因此您必须首先在 index.html
中包含该 AptList 组件的 script:
<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>
然后,您必须将以下 type 添加到底部的每个脚本标记中,在 body 结束之前:
<script type="text/babel" src="..."></script>
这将允许您使用 ES6 语法和 JSX。
我正在尝试在 script.jsx 文件中的 plnkr 上使用 React React 模块:
var AptList = require('./AptList');
这是一个 "require is not defined" 错误。
我想知道如何在 plnkr 上要求模块?
您没有使用任何捆绑器,一切都在浏览器中,因此您必须首先在 index.html
中包含该 AptList 组件的 script:
<script src="AptList.js"></script>
<script src="script.jsx"></script>
这将已经包含该组件的定义。你不需要(也不能)在那里使用 require。
在 AptList.js
中,您不需要 module.exports = AptList;
,因为它已经使用上面的脚本标签导入。此外,您应该删除 script.jsx.
现在,另一个大问题是您使用的是 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>
然后,您必须将以下 type 添加到底部的每个脚本标记中,在 body 结束之前:
<script type="text/babel" src="..."></script>
这将允许您使用 ES6 语法和 JSX。