reactjs错误未捕获的ReferenceError：未定义要求

Question

我正在.Net Core 框架中创建 reactJS。我在我的 .net 应用程序中使用 ReactJS 作为 CDN，而我的 React 应用程序抛出一个错误：require is not defined。我在下面附上我的代码：

var React = require('react');

var ReactDOM = require('react-dom');

var ReactBsTable = require('react-bootstrap-table');

var BootstrapTable = ReactBsTable.BootstrapTable;

var TableHeaderColumn = ReactBsTable.TableHeaderColumn;

var products = [{

    id: 1,

    name: "Product1",

    price: 120

}, {

    id: 2,

    name: "Product2",

    price: 80

}];

ReactDOM.render(

    <BootstrapTable data={products} version='4'>

        <TableHeaderColumn isKey dataField='id'>Product ID</TableHeaderColumn>

        <TableHeaderColumn dataField='name'>Product Name</TableHeaderColumn>

        <TableHeaderColumn dataField='price'>Product Price</TableHeaderColumn>

    </BootstrapTable>, document.getElementById('content')

);

Answer 1

请试试这个，您正在使用 cdn 的主 html 文件添加此。<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script><script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script><script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script><script type="text/babel"></script><!-- Load our React component. --><script src="new_component.js"></script><!-- ... existing HTML ... --><div id="new_component_container"></div><!-- ... existing HTML ... -->在组件文件中执行此操作，import ReactBsTable from&nbsp; 'react-bootstrap-table';var BootstrapTable = ReactBsTable.BootstrapTable;var TableHeaderColumn = ReactBsTable.TableHeaderColumn;var products = [{&nbsp; &nbsp; id: 1,&nbsp; &nbsp; name: "Product1",&nbsp; &nbsp; price: 120}, {&nbsp; &nbsp; id: 2,&nbsp; &nbsp; name: "Product2",&nbsp; &nbsp; price: 80}];const domContainer = document.querySelector('#new_component_container');ReactDOM.render(&nbsp; <BootstrapTable data={products} version='4'>&nbsp; &nbsp; <TableHeaderColumn isKey dataField='id'>Product ID</TableHeaderColumn>&nbsp; &nbsp; <TableHeaderColumn dataField='name'>Product Name</TableHeaderColumn>&nbsp; &nbsp; <TableHeaderColumn dataField='price'>Product Price</TableHeaderColumn>&nbsp; </BootstrapTable>,&nbsp;domContainer);对于反应引导表，import仅在安装库时使用。同样，如果您也为此使用cdn，那么import将无法正常工作。有关 react cdn 的更多信息，请查看此内容。https://reactjs.org/docs/add-react-to-a-website.html

Answer 2

尝试使用 ES6import而不是require即，尝试import React from 'react';import ReactDOM from 'react-dom';import ReactBsTable from 'react-bootstrap-table';因为require不是内置的 react api。您需要安装额外的库以require在反应中使用。CommonJs 为模块加载器提供 api，例如require