Help configure React Starter Kit
See original GitHub issueMy company is starting a new project based off React Starter Kit and I can’t get it to debug in Firefox. To reproduce this you’d need to clone from https://github.com/kriasoft/react-starter-kit and add a VSCode debug configuration. Here’s my .vscode\launch.json:
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
},
{
"name": "Launch localhost",
"type": "firefox",
"request": "launch",
"reAttach": true,
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
},
]
}
Then I set a breakpoint in the render function (src\routes\home\Home.js) and press F5. The chrome debugger works just fine - the breakpoint gets hit and VSCode stops. But the FF debugger for some reason does not work. The debugging session starts, a browser instance gets started, but the breakpoint does not get hit. What am I missing here? FWIW I enabled “Enable add-on debugging” and my FF version is 66.0.2 (64 bit)
Issue Analytics
- State:
- Created 4 years ago
- Comments:17 (9 by maintainers)
Top Results From Across the Web
Create a New React App
This page describes a few popular React toolchains which help with tasks like: ... Learn Gatsby from its official guide and a gallery...
Read more >kriasoft/react-starter-kit - GitHub
Pre-configured with code quality tools: ESLint, Prettier, TypeScript, Jest, etc. Pre-configured with VSCode code snippets and other VSCode settings; The ongoing ...
Read more >Starter Kits - React
Provides built-in support and simplification for Redux sub-app, reducer bundle, router, immutable, eslint + prettier, docker, monorepo and many other tools.
Read more >Let's create a Minimal React Starter Kit with most features |
In webpack development config, we will be adding hot reloading, sass support and other features. webpack.config.dev.js. In webpack production ...
Read more >React Starter Pack - Pega Community
This nested structure reflects the sections, layouts, and fields configured from Pega's reusable UI templates. Leverage this component with the included sample ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@rugk facebook/create-react-app#6828
@Fubuchi Perhaps there’s a misunderstanding here: I didn’t mean to set
devtool
to*-eval-*
literally, but to set it to any of the allowed values that contain-eval-
.@Fubuchi it’d be interesting to see what shows up when you expand the
webpack://
entry in the Loaded Scripts Explorer for Firefox. Furthermore, your webpack config and a diagnostic log from the debugadapter (with thePathConversion
andSourceMappingThreadActorProxy
loggers set toDebug
) could be helpful to diagnose the problem.@synchronos-t please set the
SourceMappingThreadActorProxy
logger toDebug
(it will show messages about the sourcemapping done when it tries to set breakpoints) and then post those messages for one breakpoint that you’re trying to set and the corresponding message from thePathConversion
logger for that file.