From 75215368ded3585f5288a28c94f27aea82958cc3 Mon Sep 17 00:00:00 2001 From: Charles Lyding <19598772+clydin@users.noreply.github.com> Date: Thu, 11 Jul 2019 12:12:17 -0400 Subject: [PATCH] fix(@angular-devkit/build-angular): support pnpm with ng serve Webpack and its development server assume the presence of two node builtins (`events` & `querystring`). Do to package hoisting npm/yarn will usually place the shims for those two builtins at locations that webpack find them. This is however not guaranteed nor will it work with pnpm which strictly follows the prescribed dependency tree. To remedy this, the specific node shims are enabled only for the specific internal webpack files that are used within the development server. This ensures that the requirements of these files does not pollute the entire application. Fixes #13680 --- .../models/webpack-configs/common.ts | 8 ++++++++ .../build_angular/src/dev-server/index.ts | 14 ++++++++++++++ 2 files changed, 22 insertions(+) diff --git a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts index a553b2d98508..38047e7b9237 100644 --- a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts +++ b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts @@ -400,6 +400,14 @@ export function getCommonConfig(wco: WebpackConfigOptions): Configuration { test: /[\/\\]@angular[\/\\]core[\/\\].+\.js$/, parser: { system: true }, }, + { + test: /[\/\\]hot[\/\\]emitter.js$/, + parser: { node: { events: true } }, + }, + { + test: /[\/\\]webpack-dev-server[\/\\]client[\/\\]utils[\/\\]createSocketUrl.js$/, + parser: { node: { querystring: true } }, + }, { test: /\.js$/, ...buildOptimizerUseRule, diff --git a/packages/angular_devkit/build_angular/src/dev-server/index.ts b/packages/angular_devkit/build_angular/src/dev-server/index.ts index 84451a0bd9c1..a270a7d6041c 100644 --- a/packages/angular_devkit/build_angular/src/dev-server/index.ts +++ b/packages/angular_devkit/build_angular/src/dev-server/index.ts @@ -406,6 +406,20 @@ function _addLiveReload( webpackConfig.plugins = []; } + // Enable the internal node plugins but no individual shims + // This is needed to allow module specific rules to include node shims + // Only needed in dev server mode to support live reload capabilities in all package managers + if (webpackConfig.node === false) { + webpackConfig.node = { + global: false, + process: false, + __filename: false, + __dirname: false, + Buffer: false, + setImmediate: false, + }; + } + // This allows for live reload of page when changes are made to repo. // https://webpack.js.org/configuration/dev-server/#devserver-inline let webpackDevServerPath;