Skip to content

Commit fbd7d05

Browse files
ocombeocombe
committed
add overrides for angular & webpack options
Fixes #14
1 parent 990b119 commit fbd7d05

File tree

10 files changed

+138
-334
lines changed

10 files changed

+138
-334
lines changed

‎packages/angular-v10/angular-v10.webpack.ts

+20-77
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ import {
2626
import { IndexHtmlWebpackPlugin } from '@angular-devkit/build-angular/src/angular-cli-files/plugins/index-html-webpack-plugin';
2727
import { getSystemPath, logging, normalize, tags } from '@angular-devkit/core';
2828
import { NodeJsSyncHost } from '@angular-devkit/core/node';
29-
import { AngularWebpack, WebpackSetup } from '@teambit/angular';
29+
import { AngularWebpack, optionValue, WebpackSetup } from '@teambit/angular';
3030
import { BundlerContext, DevServerContext } from '@teambit/bundler';
3131
import { CompositionsMain } from '@teambit/compositions';
3232
import { Logger } from '@teambit/logger';
@@ -67,66 +67,11 @@ export class AngularV10Webpack extends AngularWebpack {
6767
* Migrate options from webpack-dev-server 3 to 4
6868
*/
6969
private migrateConfiguration(webpackConfig: Configuration): Configuration {
70-
// /**
71-
// * Removed logLevel in favor of built-in logger
72-
// * see https://webpack.js.org/configuration/other-options/#infrastructurelogginglevel
73-
// */
74-
// // @ts-ignore
75-
// delete webpackConfig.devServer.logLevel;
76-
//
7770
/**
7871
* Removed contentBase in favor of the static option
7972
*/
8073
// @ts-ignore
8174
delete webpackConfig.devServer.contentBase;
82-
//
83-
// /**
84-
// * Removed publicPath in favor of the dev option
85-
// */
86-
// // @ts-ignore
87-
// delete webpackConfig.devServer.publicPath;
88-
//
89-
// /**
90-
// * Moved overlay to client option
91-
// */
92-
// // @ts-ignore
93-
// webpackConfig.devServer.client = webpackConfig.devServer.client || {};
94-
// // @ts-ignore
95-
// webpackConfig.devServer.client.overlay = webpackConfig.devServer.overlay;
96-
// // @ts-ignore
97-
// delete webpackConfig.devServer.overlay;
98-
//
99-
// /**
100-
// * Removed in favor of the static option
101-
// */
102-
// // @ts-ignore
103-
// delete webpackConfig.devServer.watchOptions;
104-
//
105-
// /**
106-
// * Moved sockPath to client option path
107-
// */
108-
// // @ts-ignore
109-
// webpackConfig.devServer.client.path = webpackConfig.devServer.sockPath;
110-
// // @ts-ignore
111-
// delete webpackConfig.devServer.sockPath;
112-
//
113-
// /**
114-
// * Removed stats in favor of the stats options from webpack
115-
// */
116-
// // @ts-ignore
117-
// delete webpackConfig.devServer.stats;
118-
//
119-
// /**
120-
// * Cleaning up undefined values
121-
// */
122-
// // @ts-ignore
123-
// Object.keys(webpackConfig.devServer).forEach(option => {
124-
// // @ts-ignore
125-
// if (typeof webpackConfig.devServer[option] === 'undefined') {
126-
// // @ts-ignore
127-
// delete webpackConfig.devServer[option];
128-
// }
129-
// })
13075

13176
return webpackConfig;
13277
}
@@ -138,34 +83,32 @@ export class AngularV10Webpack extends AngularWebpack {
13883
workspaceRoot: string,
13984
logger: Logger,
14085
setup: WebpackSetup,
141-
extraOptions: Partial<WebpackConfigWithDevServer> = {}
86+
webpackOptions: Partial<WebpackConfigWithDevServer> = {},
87+
angularOptions: Partial<BrowserBuilderSchema> = {}
14288
): Promise<WebpackConfigWithDevServer | Configuration> {
14389
// Options from angular.json
14490
const browserOptions: BrowserBuilderSchema = {
91+
...angularOptions,
14592
baseHref: path.posix.join('/', context.rootPath!, context.publicPath!),
14693
preserveSymlinks: true,
14794
outputPath: 'public', // doesn't matter because it will be deleted from the config
14895
index: 'src/index.html',
14996
main: 'src/main.ts',
15097
polyfills: 'src/polyfills.ts',
15198
tsConfig: tsconfigPath,
152-
assets: ['src/favicon.ico', 'src/assets'],
153-
styles: ['src/styles.scss'],
154-
scripts: [],
155-
vendorChunk: true,
156-
namedChunks: true,
157-
optimization: setup === WebpackSetup.Build,
158-
buildOptimizer: setup === WebpackSetup.Build,
159-
aot: true,
160-
deleteOutputPath: true,
161-
sourceMap: setup === WebpackSetup.Serve,
162-
outputHashing: setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None,
163-
// inlineStyleLanguage: InlineStyleLanguage.Scss,
99+
assets: ['src/favicon.ico', 'src/assets', ...(angularOptions.assets || [])],
100+
styles: ['src/styles.scss', ...(angularOptions.styles || [])],
101+
scripts: angularOptions.scripts,
102+
vendorChunk: optionValue(angularOptions.vendorChunk, true),
103+
namedChunks: optionValue(angularOptions.namedChunks, true),
104+
optimization: optionValue(angularOptions.optimization, setup === WebpackSetup.Build),
105+
buildOptimizer: optionValue(angularOptions.buildOptimizer, setup === WebpackSetup.Build),
106+
aot: optionValue(angularOptions.aot, true),
107+
deleteOutputPath: optionValue(angularOptions.deleteOutputPath, true),
108+
sourceMap: optionValue(angularOptions.sourceMap, setup === WebpackSetup.Serve),
109+
outputHashing: optionValue(angularOptions.outputHashing, setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None),
164110
watch: setup === WebpackSetup.Serve,
165-
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql'],
166-
// deployUrl: undefined,
167-
// subresourceIntegrity: undefined,
168-
// crossOrigin: undefined,
111+
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql', ...(angularOptions.allowedCommonJsDependencies || [])],
169112
};
170113

171114
const normalizedWorkspaceRoot = normalize(workspaceRoot);
@@ -175,7 +118,7 @@ export class AngularV10Webpack extends AngularWebpack {
175118
const host = new NodeJsSyncHost();
176119
const normalizedOptions = normalizeBrowserSchema(host, normalizedWorkspaceRoot, projectRoot, sourceRoot, {
177120
...browserOptions,
178-
...(extraOptions as Partial<BrowserBuilderSchema & DevServerBuilderOptions>),
121+
...(webpackOptions as Partial<BrowserBuilderSchema & DevServerBuilderOptions>),
179122
});
180123

181124
const loggerApi = {
@@ -205,7 +148,7 @@ export class AngularV10Webpack extends AngularWebpack {
205148
if(setup === WebpackSetup.Serve) {
206149
webpackConfig.devServer = buildServerConfig(
207150
normalizedWorkspaceRoot,
208-
extraOptions as DevServerBuilderOptions,
151+
webpackOptions as DevServerBuilderOptions,
209152
browserOptions,
210153
loggerApi
211154
);
@@ -215,7 +158,7 @@ export class AngularV10Webpack extends AngularWebpack {
215158
webpackConfig.entry.main.unshift(...entryFiles);
216159

217160
// @ts-ignore
218-
if (extraOptions.liveReload && !extraOptions.hmr) {
161+
if (webpackOptions.liveReload && !webpackOptions.hmr) {
219162
// This is needed because we cannot use the inline option directly in the config
220163
// because of the SuppressExtractedTextChunksWebpackPlugin
221164
// Consider not using SuppressExtractedTextChunksWebpackPlugin when liveReload is enable.
@@ -250,7 +193,7 @@ export class AngularV10Webpack extends AngularWebpack {
250193
}
251194

252195
// @ts-ignore
253-
if (extraOptions.hmr) {
196+
if (webpackOptions.hmr) {
254197
logger.warn(tags.stripIndents`NOTICE: Hot Module Replacement (HMR) is enabled for the dev server.
255198
See https://webpack.js.org/guides/hot-module-replacement for information on working with HMR for Webpack.`);
256199
}

‎packages/angular-v11/angular-v11.webpack.ts

+19-76
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import {
2121
} from '@angular-devkit/build-angular/src/webpack/configs';
2222
import { IndexHtmlWebpackPlugin } from '@angular-devkit/build-angular/src/webpack/plugins/index-html-webpack-plugin';
2323
import { getSystemPath, logging, normalize, tags } from '@angular-devkit/core';
24-
import { AngularWebpack, WebpackSetup } from '@teambit/angular';
24+
import { AngularWebpack, optionValue, WebpackSetup } from '@teambit/angular';
2525
import { Workspace } from '@teambit/workspace';
2626
import { CompositionsMain } from '@teambit/compositions';
2727
import { webpack4ServeConfigFactory } from './webpack/webpack4.serve.config';
@@ -54,66 +54,11 @@ export class AngularV11Webpack extends AngularWebpack {
5454
* Migrate options from webpack-dev-server 3 to 4
5555
*/
5656
private migrateConfiguration(webpackConfig: Configuration): Configuration {
57-
// /**
58-
// * Removed logLevel in favor of built-in logger
59-
// * see https://webpack.js.org/configuration/other-options/#infrastructurelogginglevel
60-
// */
61-
// // @ts-ignore
62-
// delete webpackConfig.devServer.logLevel;
63-
//
6457
/**
6558
* Removed contentBase in favor of the static option
6659
*/
6760
// @ts-ignore
6861
delete webpackConfig.devServer.contentBase;
69-
//
70-
// /**
71-
// * Removed publicPath in favor of the dev option
72-
// */
73-
// // @ts-ignore
74-
// delete webpackConfig.devServer.publicPath;
75-
//
76-
// /**
77-
// * Moved overlay to client option
78-
// */
79-
// // @ts-ignore
80-
// webpackConfig.devServer.client = webpackConfig.devServer.client || {};
81-
// // @ts-ignore
82-
// webpackConfig.devServer.client.overlay = webpackConfig.devServer.overlay;
83-
// // @ts-ignore
84-
// delete webpackConfig.devServer.overlay;
85-
//
86-
// /**
87-
// * Removed in favor of the static option
88-
// */
89-
// // @ts-ignore
90-
// delete webpackConfig.devServer.watchOptions;
91-
//
92-
// /**
93-
// * Moved sockPath to client option path
94-
// */
95-
// // @ts-ignore
96-
// webpackConfig.devServer.client.path = webpackConfig.devServer.sockPath;
97-
// // @ts-ignore
98-
// delete webpackConfig.devServer.sockPath;
99-
//
100-
// /**
101-
// * Removed stats in favor of the stats options from webpack
102-
// */
103-
// // @ts-ignore
104-
// delete webpackConfig.devServer.stats;
105-
//
106-
// /**
107-
// * Cleaning up undefined values
108-
// */
109-
// // @ts-ignore
110-
// Object.keys(webpackConfig.devServer).forEach(option => {
111-
// // @ts-ignore
112-
// if (typeof webpackConfig.devServer[option] === 'undefined') {
113-
// // @ts-ignore
114-
// delete webpackConfig.devServer[option];
115-
// }
116-
// })
11762

11863
return webpackConfig;
11964
}
@@ -125,34 +70,32 @@ export class AngularV11Webpack extends AngularWebpack {
12570
workspaceRoot: string,
12671
logger: Logger,
12772
setup: WebpackSetup,
128-
extraOptions: Partial<WebpackConfigWithDevServer> = {}
73+
webpackOptions: Partial<WebpackConfigWithDevServer> = {},
74+
angularOptions: Partial<BrowserBuilderSchema> = {}
12975
): Promise<WebpackConfigWithDevServer | Configuration> {
13076
// Options from angular.json
13177
const browserOptions: BrowserBuilderSchema = {
78+
...angularOptions,
13279
baseHref: path.posix.join('/', context.rootPath!, context.publicPath!),
13380
preserveSymlinks: true,
13481
outputPath: 'public', // doesn't matter because it will be deleted from the config
13582
index: 'src/index.html',
13683
main: 'src/main.ts',
13784
polyfills: 'src/polyfills.ts',
13885
tsConfig: tsconfigPath,
139-
assets: ['src/favicon.ico', 'src/assets'],
140-
styles: ['src/styles.scss'],
141-
scripts: [],
142-
vendorChunk: true,
143-
namedChunks: true,
144-
optimization: setup === WebpackSetup.Build,
145-
buildOptimizer: setup === WebpackSetup.Build,
146-
aot: true,
147-
deleteOutputPath: true,
148-
sourceMap: setup === WebpackSetup.Serve,
149-
outputHashing: setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None,
150-
// inlineStyleLanguage: InlineStyleLanguage.Scss,
86+
assets: ['src/favicon.ico', 'src/assets', ...(angularOptions.assets || [])],
87+
styles: ['src/styles.scss', ...(angularOptions.styles || [])],
88+
scripts: angularOptions.scripts,
89+
vendorChunk: optionValue(angularOptions.vendorChunk, true),
90+
namedChunks: optionValue(angularOptions.namedChunks, true),
91+
optimization: optionValue(angularOptions.optimization, setup === WebpackSetup.Build),
92+
buildOptimizer: optionValue(angularOptions.buildOptimizer, setup === WebpackSetup.Build),
93+
aot: optionValue(angularOptions.aot, true),
94+
deleteOutputPath: optionValue(angularOptions.deleteOutputPath, true),
95+
sourceMap: optionValue(angularOptions.sourceMap, setup === WebpackSetup.Serve),
96+
outputHashing: optionValue(angularOptions.outputHashing, setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None),
15197
watch: setup === WebpackSetup.Serve,
152-
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql'],
153-
// deployUrl: undefined,
154-
// subresourceIntegrity: undefined,
155-
// crossOrigin: undefined,
98+
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql', ...(angularOptions.allowedCommonJsDependencies || [])],
15699
};
157100

158101
const normalizedWorkspaceRoot = normalize(workspaceRoot);
@@ -161,7 +104,7 @@ export class AngularV11Webpack extends AngularWebpack {
161104

162105
const normalizedOptions = normalizeBrowserSchema(normalizedWorkspaceRoot, projectRoot, sourceRoot, {
163106
...browserOptions,
164-
...(extraOptions as Partial<BrowserBuilderSchema & DevServerBuilderOptions>),
107+
...(webpackOptions as Partial<BrowserBuilderSchema & DevServerBuilderOptions>),
165108
});
166109

167110
const loggerApi = {
@@ -191,7 +134,7 @@ export class AngularV11Webpack extends AngularWebpack {
191134
webpackConfig.entry.main.unshift(...entryFiles);
192135

193136
// @ts-ignore
194-
if (extraOptions.liveReload && !extraOptions.hmr) {
137+
if (webpackOptions.liveReload && !webpackOptions.hmr) {
195138
// This is needed because we cannot use the inline option directly in the config
196139
// because of the SuppressExtractedTextChunksWebpackPlugin
197140
// Consider not using SuppressExtractedTextChunksWebpackPlugin when liveReload is enable.
@@ -226,7 +169,7 @@ export class AngularV11Webpack extends AngularWebpack {
226169
}
227170

228171
// @ts-ignore
229-
if (extraOptions.hmr) {
172+
if (webpackOptions.hmr) {
230173
logger.warn(tags.stripIndents`NOTICE: Hot Module Replacement (HMR) is enabled for the dev server.
231174
See https://webpack.js.org/guides/hot-module-replacement for information on working with HMR for Webpack.`);
232175
}

0 commit comments

Comments
 (0)