fix: pass externals to webpack config

Closes #42

Author: swashata

packages/scripts/__tests__/config/WebpackConfigHelper.spec.ts

@@ -1,4 +1,5 @@
 import { PresetOptions } from '@wpackio/babel-preset-base/lib/preset';
+// tslint:disable-next-line:no-implicit-dependencies
 import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
 import miniCssExtractPlugin from 'mini-css-extract-plugin';
 import path from 'path';
@@ -472,6 +473,20 @@ describe('CreateWebPackConfig', () => {
 
 	// getCommmon
 	describe('getCommon', () => {
+		test('has externals', () => {
+			const cwc = new WebpackConfigHelper(
+				projectConfig.files[0],
+				{
+					...getConfigFromProjectAndServer(
+						projectConfig,
+						serverConfig
+					),
+				},
+				'/foo/bar',
+				true
+			);
+			expect(cwc.getCommon().externals).toBe(projectConfig.externals);
+		});
 		test('sends proper stuff depending on isDev', () => {
 			const cwc = new WebpackConfigHelper(
 				projectConfig.files[0],

packages/scripts/__tests__/config/__snapshots__/WebpackConfigHelper.spec.ts.snap

@@ -4,6 +4,9 @@ exports[`CreateWebPackConfig getCommon sends proper stuff depending on isDev 1`]
 Object {
   "context": "/foo/bar",
   "devtool": "source-map",
+  "externals": Object {
+    "jquery": "jQuery",
+  },
   "mode": "production",
   "name": "config1",
   "target": "web",
@@ -15,6 +18,9 @@ exports[`CreateWebPackConfig getCommon sends proper stuff depending on isDev 2`]
 Object {
   "context": "/foo/bar",
   "devtool": "inline-source-map",
+  "externals": Object {
+    "jquery": "jQuery",
+  },
   "mode": "development",
   "name": "config1",
   "target": "web",

packages/scripts/__tests__/helpers/testUtils.ts

@@ -56,5 +56,6 @@ export function getConfigFromProjectAndServer(
 			pCfg.outputPath
 		}/`,
 		errorOverlay: true,
+		externals: pCfg.externals,
 	};
 }

packages/scripts/src/config/CreateWebpackConfig.ts

@@ -142,6 +142,7 @@ export class CreateWebpackConfig {
 			outputPath,
 			appName,
 			errorOverlay,
+			externals,
 		} = this.projectConfig;
 		const { host, port } = this.serverConfig;
 		const helper: WebpackConfigHelper = new WebpackConfigHelper(
@@ -162,6 +163,7 @@ export class CreateWebpackConfig {
 				publicPath: this.getPublicPath(),
 				publicPathUrl: this.getPublicPathUrl(),
 				errorOverlay,
+				externals,
 			},
 			this.cwd,
 			this.isDev

packages/scripts/src/config/WebpackConfigHelper.ts

@@ -45,6 +45,7 @@ export interface WebpackConfigHelperConfig {
 	publicPath: string; // Not used right now, but maybe we will need it in future?
 	publicPathUrl: string;
 	errorOverlay: ProjectConfig['errorOverlay'];
+	externals: ProjectConfig['externals'];
 }
 
 interface CommonWebpackConfig {
@@ -54,6 +55,7 @@ interface CommonWebpackConfig {
 	watch: webpack.Configuration['watch'];
 	mode: webpack.Configuration['mode'];
 	name: webpack.Configuration['name'];
+	externals: webpack.Configuration['externals'];
 }
 
 /**
@@ -540,6 +542,7 @@ ${bannerConfig.copyrightText}${bannerConfig.credit ? creditNote : ''}`,
 			watch: this.isDev,
 			mode: this.env,
 			name: this.file.name,
+			externals: this.config.externals,
 		};
 	}