Why I can only set valid breakpoints in .js files in vscode AFTER starting the vite (node.js) debugger?
Not working:
- npx vite (starting the server)
- Set breakpoint in vscode
- Start Debugger with F5
- New chrome window opens
Debugger does start but not react, only stoppable
Working:
- npx vite (starting the server)
- Start Debugger with F5
- Set breakpoint in vscode
- New chrome window opens
Debugger stopps at breakpoint and variables are visible. But with this methode I can only debug functions which are called after all initialisations?
// vite.config.js
import { defineConfig } from 'vite';
import dns from 'dns'
dns.setDefaultResultOrder('verbatim')
export default defineConfig({
server: {
host: '127.0.0.1',
port: 3000
},
build: {
outDir: 'dist',
emptyOutDir: true,
rollupOptions: {
input: {
main: 'js/main.js',
},
output: {
entryFileNames: 'bundle.js',
assetFileNames: false,
},
},
sourcemap: false
},
publicDir: false,
css: false,
});
// launch.json
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:3000",
"enableContentValidation": false,
"webRoot": "${workspaceFolder}",
"sourceMapPathOverrides": {
"webpack:///src/*": "${workspaceFolder}/*",
"webpack:///js/*": "${workspaceFolder}/js/*"
},
"trace": true
}
]
}
Any idea? Thanks…