Javascript index.js中超出了最大调用堆栈大小

我创建了一个完全符合要求的react应用程序，但在localhost上运行web应用程序时，页面会继续加载而不呈现任何内容。除此之外，我还在visual studio代码中显示一个错误，该错误表示

“index.js中超出了最大调用堆栈大小”

。这是index.js文件和与之关联的其他文件

import React from 'react';
import ReactDOM from 'react-dom';
import AppRouter from './routers/AppRouter';

ReactDOM.render(<AppRouter />, document.getElementById('root'));

---

很可能是因为

index.js

中的某些内容具有循环依赖关系——函数a调用函数b，但函数b调用函数a

例如，它可以是组件的渲染调用，并且该组件包含其自己的父级

---

调试器是一个很好的建议，网上有关于如何使用调试器的教程，你可以从我在评论中提到的SO帖子开始。又是这样：

你试过调试代码（并查看调用堆栈）吗？嘿，你能帮我吗，因为我完全不知道该怎么做？什么是调试器，它能帮我什么？你有没有研究过如何调试reactjs？像

“最大调用堆栈大小”

这样的错误通常是由无界递归函数引起的，这意味着在你的代码中的某个地方，你可能有一个你不想要的递归调用。正如其他评论所建议的，这是了解问题所在的最佳方式。

import React from 'react';
import {BrowserRouter,Route,Switch} from 'react-router-dom';
import ExpenseDashboardPage from '../components/ExpenseDashboardPage.js';
import AddPage from '../components/AddPage.js';
import EditPage from '../components/EditPage.js';
import HelpPage from '../components/HelpPage.js';
import NotFoundPage from '../components/NotFoundPage.js'
import Header from '../components/Header.js'


console.log("working ");
    const AppRouter = ()=>(
        <BrowserRouter>
        <div>
        <Header/>
        <Switch>
         <Route path="/" component={ExpenseDashboardPage} exact={true}/>
         <Route path="/create" component={AddPage}/>
         <Route path="/edit/:id" component={EditPage} exact={true}/>
         <Route path="/help" component={HelpPage} exact={true}/>
         <Route  component={NotFoundPage}/>
        </Switch>
        </div>
        </BrowserRouter>
    );

    export default AppRouter;

    Debugger listening on ws://127.0.0.1:47583/31bb1f1c-c7f5-49e3-82e6-ecbefb58d193
SyntaxError: Unexpected token import
vm.js:80
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:607:28)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
    at Function.Module.runMain (module.js:684:10)
    at startup (bootstrap_node.js:187:16)
    at bootstrap_node.js:608:3
Debugger attached.
e:\demo\src\routers\AppRouter.js:1
(function (exports, require, module, __filename, __dirname) { import React from 'react';
                                                              ^^^^^^

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:607:28)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
    at Function.Module.runMain (module.js:684:10)
    at startup (bootstrap_node.js:187:16)
    at bootstrap_node.js:608:3
Waiting for the debugger to disconnect...