
adjust the url field (here I change the port to 3000).You let VS Code create a launch.json config for you and slightly adjust it. Starting to debug your React app with the VS Code debugger is surprisingly simple. Alternatively, you can find a detailed step-by-step tutorial with screenshots on this page. Here’s a short video showing how to set up and use the VS Code debugger. All of this paired with a structured debugging approach and the bug is fixed in no time. We’ll debug a small problem with a Next.js application and use (conditional) breakpoints, step into functions, and inspect and edit variables directly from the VS Code. On this page, you can see how to set up VS Code as a debugger for your React app and see it in action. The result: Super easy setup and a more productive debugging workflow. Turns out much beloved VS Code makes it very simple to debug a React app directly from the IDE. Or a more advanced version: Jumping around between setting breakpoints in the Chrome dev tools and editing code in your IDE until the bug is fixed.īut with the right tools and a strategic approach debugging can become much easier. Adding a console.log() statement here and there until you’re finally in the right spot. React Profiler 介绍 – React Blog (docschina.Debugging a React app can be a slow and painful process. Optimizing Performance – React () React Profiler js function getRollupOutputOptions ( outputPath, format, globals, globalName, bundleType ) # 5. # 拉取代码 git clone https: ///facebook/react.git
