ReactJS:未捕获的ReferenceError:需求未定义 [英] ReactJS: Uncaught ReferenceError: require is not defined

问题描述

我正在尝试在React JS中使用DRY.我正在尝试在不同文件中使用相同的HTML部分

I'm trying to use DRY in React JS. I'm trying to use the same HTML partial in different files

部分:

var AdminMenu = React.createClass({
 getInitialState: function() {
   return {};
 },
 render: function() {
   return (
     <h1>Menu</h1>
   );
 }
});

我要在另一个文件中重新请求它:

I'm requeiring it in another file:

require('./scripts/adminMenu.js');

ReactDOM.render(
 <AdminMenu/>,
 document.getElementById('content')
);

但是我遇到一个错误:

Uncaught ReferenceError: require is not defined

此脚本包含在html页面上，例如:< script type ="text/babel" src ="scripts/admin.js"></script>

this scripts are included on html page like: <script type="text/babel" src="scripts/admin.js"></script>

我正在使用webpack

I'm using webpack

推荐答案

如果您没有使用任何模块捆绑程序，例如webpack等.您应该将组件分配给某些javascript全局对象，因为.jsx中的对象不会放在全局范围内

If you are not using any module bundler like webpack or etc. You should assign you components to some javascript global object, because objects from .jsx are not put in global scope

因此，这是解决方案(此处使用了 window 对象)

So here is the solution (used window object here)

定义的模块:

window.AdminMenu = React.createClass({
  getInitialState: function() {
    return {};
  },
  render: function() {
    return (
      <h1>Menu</h1>
    );
  }
});

使用它的地方:

ReactDOM.render(
  <window.AdminMenu/>,
  document.getElementById('content')
);

这篇关于ReactJS:未捕获的ReferenceError:需求未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！