Skip to content
This repository has been archived by the owner on Jan 11, 2023. It is now read-only.

Enable debugging in Chrome and VS Code - fixes #435 #436

Merged
merged 1 commit into from
Sep 19, 2018
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 19 additions & 1 deletion src/api/dev.ts
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,8 @@ class Watcher extends EventEmitter {
live: boolean;
hot: boolean;

devtools_port: number;

dev_server: DevServer;
proc: child_process.ChildProcess;
filewatchers: Array<{ close: () => void }>;
Expand All @@ -57,6 +59,7 @@ class Watcher extends EventEmitter {
'dev-port': dev_port,
live,
hot,
'devtools-port': devtools_port,
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've added this here with an eye towards making the DevTools port a command-line switch in the future.

bundler,
webpack = 'webpack',
rollup = 'rollup',
Expand All @@ -68,6 +71,7 @@ class Watcher extends EventEmitter {
'dev-port': number,
live: boolean,
hot: boolean,
'devtools-port': number,
bundler?: string,
webpack: string,
rollup: string,
Expand All @@ -84,6 +88,8 @@ class Watcher extends EventEmitter {
this.live = live;
this.hot = hot;

this.devtools_port = devtools_port;

this.filewatchers = [];

this.current_build = {
Expand Down Expand Up @@ -129,6 +135,9 @@ class Watcher extends EventEmitter {

if (!this.dev_port) this.dev_port = await ports.find(10000);

// Chrome looks for debugging targets on ports 9222 and 9229 by default
if (!this.devtools_port) this.devtools_port = await ports.find(9222);

let manifest_data: ManifestData;

try {
Expand Down Expand Up @@ -238,12 +247,21 @@ class Watcher extends EventEmitter {
restart();
}

// we need to give the child process its own DevTools port,
// otherwise Node will try to use the parent's (and fail)
const debugArgRegex = /--inspect(?:-brk|-port)?|--debug-port/;
const execArgv = process.execArgv.slice();
if (execArgv.some((arg: string) => !!arg.match(debugArgRegex))) {
execArgv.push(`--inspect-port=${this.devtools_port}`);
}

this.proc = child_process.fork(`${dest}/server.js`, [], {
cwd: process.cwd(),
env: Object.assign({
PORT: this.port
}, process.env),
stdio: ['ipc']
stdio: ['ipc'],
execArgv
});

this.proc.stdout.on('data', chunk => {
Expand Down