diff --git a/build/gulpfile.extensions.js b/build/gulpfile.extensions.js
index 25cccf6d8e5..12e34f60aff 100644
--- a/build/gulpfile.extensions.js
+++ b/build/gulpfile.extensions.js
@@ -8,9 +8,11 @@ require('events').EventEmitter.defaultMaxListeners = 100;
 
 const gulp = require('gulp');
 const path = require('path');
+const nodeUtil = require('util');
 const tsb = require('gulp-tsb');
 const es = require('event-stream');
 const filter = require('gulp-filter');
+const webpack = require('webpack');
 const util = require('./lib/util');
 const task = require('./lib/task');
 const watcher = require('./lib/watch');
@@ -21,6 +23,8 @@ const nlsDev = require('vscode-nls-dev');
 const root = path.dirname(__dirname);
 const commit = util.getVersion(root);
 const plumber = require('gulp-plumber');
+const fancyLog = require('fancy-log');
+const ansiColors = require('ansi-colors');
 const ext = require('./lib/extensions');
 
 const extensionsPath = path.join(path.dirname(__dirname), 'extensions');
@@ -167,3 +171,78 @@ const compileExtensionsBuildTask = task.define('compile-extensions-build', task.
 
 gulp.task(compileExtensionsBuildTask);
 exports.compileExtensionsBuildTask = compileExtensionsBuildTask;
+
+const compileWebExtensionsTask = task.define('compile-web', () => buildWebExtensions(false));
+gulp.task(compileWebExtensionsTask);
+exports.compileWebExtensionsTask = compileWebExtensionsTask;
+
+const watchWebExtensionsTask = task.define('watch-web', () => buildWebExtensions(true));
+gulp.task(watchWebExtensionsTask);
+exports.watchWebExtensionsTask = watchWebExtensionsTask;
+
+async function buildWebExtensions(isWatch) {
+
+	const webpackConfigLocations = await nodeUtil.promisify(glob)(
+		path.join(extensionsPath, '**', 'extension-browser.webpack.config.js'),
+		{ ignore: ['**/node_modules'] }
+	);
+
+	const webpackConfigs = [];
+
+	for (const webpackConfigPath of webpackConfigLocations) {
+		const configOrFnOrArray = require(webpackConfigPath);
+		function addConfig(configOrFn) {
+			if (typeof configOrFn === 'function') {
+				webpackConfigs.push(configOrFn({}, {}));
+			} else {
+				webpackConfigs.push(configOrFn);
+			}
+		}
+		addConfig(configOrFnOrArray);
+	}
+	function reporter(fullStats) {
+		if (Array.isArray(fullStats.children)) {
+			for (const stats of fullStats.children) {
+				const outputPath = stats.outputPath;
+				if (outputPath) {
+					const relativePath = path.relative(extensionsPath, outputPath);
+					const match = relativePath.match(/[^\/]+(\/server|\/client)?/);
+					fancyLog(`Finished ${ansiColors.green('packaging web extension')} ${ansiColors.cyan(match[0])} with ${stats.errors.length} errors.`);
+				}
+				if (Array.isArray(stats.errors)) {
+					stats.errors.forEach(error => {
+						fancyLog.error(error);
+					});
+				}
+				if (Array.isArray(stats.warnings)) {
+					stats.warnings.forEach(warning => {
+						fancyLog.warn(warning);
+					});
+				}
+			}
+		}
+	}
+	return new Promise((resolve, reject) => {
+		if (isWatch) {
+			webpack(webpackConfigs).watch({}, (err, stats) => {
+				if (err) {
+					reject();
+				} else {
+					reporter(stats.toJson());
+				}
+			});
+		} else {
+			webpack(webpackConfigs).run((err, stats) => {
+				if (err) {
+					fancyLog.error(err);
+					reject();
+				} else {
+					reporter(stats.toJson());
+					resolve();
+				}
+			});
+		}
+	});
+}
+
+
diff --git a/resources/serverless/code-web.js b/resources/serverless/code-web.js
index 893844cf92d..b62185f107b 100644
--- a/resources/serverless/code-web.js
+++ b/resources/serverless/code-web.js
@@ -12,10 +12,10 @@ const url = require('url');
 const fs = require('fs');
 const path = require('path');
 const util = require('util');
-const glob = require('glob');
 const opn = require('opn');
 const minimist = require('minimist');
-const webpack = require('webpack');
+const fancyLog = require('fancy-log');
+const ansiColors = require('ansi-colors');
 
 const APP_ROOT = path.join(__dirname, '..', '..');
 const EXTENSIONS_ROOT = path.join(APP_ROOT, 'extensions');
@@ -59,11 +59,11 @@ const AUTHORITY = process.env.VSCODE_AUTHORITY || `${HOST}:${PORT}`;
 
 const exists = (path) => util.promisify(fs.exists)(path);
 const readFile = (path) => util.promisify(fs.readFile)(path);
-const CharCode_PC = '%'.charCodeAt(0);
+
+let unbuiltExensions = [];
 
 async function initialize() {
 	const builtinExtensions = [];
-	const webpackConfigs = [];
 
 	const children = await util.promisify(fs.readdir)(EXTENSIONS_ROOT, { withFileTypes: true });
 	const folders = children.filter(c => !c.isFile());
@@ -95,24 +95,14 @@ async function initialize() {
 				if (packageJSON.browser) {
 					packageJSON.main = packageJSON.browser;
 
-					const webpackConfigLocations = await util.promisify(glob)(
-						path.join(EXTENSIONS_ROOT, folderName, '**', 'extension-browser.webpack.config.js'),
-						{ ignore: ['**/node_modules'] }
-					);
-
-					for (const webpackConfigPath of webpackConfigLocations) {
-						const configOrFnOrArray = require(webpackConfigPath);
-						function addConfig(configOrFn) {
-							if (typeof configOrFn === 'function') {
-								webpackConfigs.push(configOrFn({}, {}));
-							} else {
-								webpackConfigs.push(configOrFn);
-							}
-						}
-						addConfig(configOrFnOrArray);
+					let mainFilePath = path.join(EXTENSIONS_ROOT, folderName, packageJSON.browser);
+					if (path.extname(mainFilePath) !== '.js') {
+						mainFilePath += '.js';
+					}
+					if (!await exists(mainFilePath)) {
+						unbuiltExensions.push(path.relative(EXTENSIONS_ROOT, mainFilePath))
 					}
 				}
-
 				packageJSON.extensionKind = ['web']; // enable for Web
 
 				const packageNLSPath = path.join(folderName, 'package.nls.json');
@@ -129,30 +119,10 @@ async function initialize() {
 			}
 		}
 	}));
-
-	return new Promise((resolve, reject) => {
-		if (args.watch) {
-			webpack(webpackConfigs).watch({}, (err, stats) => {
-				if (err) {
-					console.log(err);
-					reject();
-				} else {
-					console.log(stats.toString());
-					resolve(builtinExtensions);
-				}
-			});
-		} else {
-			webpack(webpackConfigs).run((err, stats) => {
-				if (err) {
-					console.log(err);
-					reject();
-				} else {
-					console.log(stats.toString());
-					resolve(builtinExtensions);
-				}
-			});
-		}
-	});
+	if (unbuiltExensions.length) {
+		fancyLog(`${ansiColors.yellow('Warning')}: Make sure to run ${ansiColors.cyan('yarn gulp watch-web')}\nCould not find the following browser main files: \n${unbuiltExensions.join('\n')}`);
+	}
+	return builtinExtensions;
 }
 
 const builtinExtensionsPromise = initialize();