Skip to content

Commit e6004b7

Browse files
committed
fix angular 14 & 15 webpack configs
1 parent c04d4ae commit e6004b7

23 files changed

Lines changed: 227 additions & 147 deletions

scopes/dev-services/compiler/angular-elements-loader/loader.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ if(typeof window !== 'undefined') {
55
}
66
import { Injector, NgModuleRef, Type } from '@angular/core';
77
import { createCustomElement } from '@angular/elements';
8-
import { BrowserModule } from '@angular/platform-browser';
98
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
109
import React from 'react';
1110
import { AppModule } from './main';
@@ -69,7 +68,7 @@ async function getModuleComponents<M>(module: Type<M>): Promise<Type<any>[]> {
6968
if (!module.prototype.ngDoBootstrap) {
7069
module.prototype.ngDoBootstrap = AppModule.prototype.ngDoBootstrap;
7170
}
72-
if (!moduleProps.imports.includes(BrowserModule)) {
71+
if (!moduleProps.imports.some((module: Type<any>) => module.prototype.constructor.name === 'BrowserModule')) {
7372
// eslint-disable-next-line no-console
7473
console.warn(`Automatically injecting "BrowserModule" into your composition for retro-compatibility, please add it to the imports of your module "${module.name}"`);
7574
const moduleInjector = Reflect.get(module, 'ɵinj');

scopes/dev-services/compiler/angular-elements/angular-elements.compiler.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
} from '@teambit/builder';
1212
import { Compiler, TranspileComponentParams } from '@teambit/compiler';
1313
import { Component } from '@teambit/component';
14-
import { Composition, CompositionsMain } from '@teambit/compositions';
14+
import { CompositionsMain } from '@teambit/compositions';
1515
import { Timer } from '@teambit/legacy/dist/toolbox/timer';
1616
import { Logger } from '@teambit/logger';
1717
import { NgccProcessor } from '@teambit/ngcc';
@@ -65,7 +65,8 @@ export class AngularElementsCompiler implements Compiler {
6565
entries: entryFiles,
6666
sourceRoot: componentDir,
6767
dest: dist,
68-
moduleName: component.id.fullName
68+
moduleName: component.id.fullName,
69+
nodeModulesPaths: this.nodeModulesPaths
6970
}, watch, 'full');
7071
const duration = timer.stop();
7172
this.logger.console(chalk.green(`\n------------------------------------------------------------------------------

scopes/versions/angular-v10/angular-v10.webpack.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@ export class AngularV10Webpack extends AngularBaseWebpack {
115115
sourceMap: angularOptions.sourceMap ?? true,
116116
outputHashing: angularOptions.outputHashing ?? (setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None),
117117
watch: setup === WebpackSetup.Serve,
118-
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
118+
allowedCommonJsDependencies: ['dompurify', '@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
119119
};
120120

121121
const normalizedWorkspaceRoot = normalize(workspaceRoot);

scopes/versions/angular-v11/angular-v11.webpack.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ export class AngularV11Webpack extends AngularBaseWebpack {
102102
sourceMap: angularOptions.sourceMap ?? true,
103103
outputHashing: angularOptions.outputHashing ?? (setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None),
104104
watch: setup === WebpackSetup.Serve,
105-
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
105+
allowedCommonJsDependencies: ['dompurify', '@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
106106
};
107107

108108
const normalizedWorkspaceRoot = normalize(workspaceRoot);

scopes/versions/angular-v12/angular-v12.webpack.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,7 @@ export class AngularV12Webpack extends AngularBaseWebpack {
139139
sourceMap: angularOptions.sourceMap ?? true,
140140
outputHashing: angularOptions.outputHashing ?? (setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None),
141141
watch: setup === WebpackSetup.Serve,
142-
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
142+
allowedCommonJsDependencies: ['dompurify', '@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
143143
};
144144
const normalizedWorkspaceRoot = normalize(workspaceRoot);
145145
const projectRoot = normalize('');

scopes/versions/angular-v13/angular-v13.webpack.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,7 @@ export class AngularV13Webpack extends AngularBaseWebpack {
138138
sourceMap: angularOptions.sourceMap ?? true,
139139
outputHashing: angularOptions.outputHashing ?? (setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None),
140140
watch: setup === WebpackSetup.Serve,
141-
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
141+
allowedCommonJsDependencies: ['dompurify', '@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
142142
};
143143
const normalizedWorkspaceRoot = normalize(workspaceRoot);
144144
const projectRoot = normalize('');

scopes/versions/angular-v14/angular-v14.main.runtime.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,6 @@ export class AngularV14Main extends AngularBaseMain {
8484
CompositionsMain,
8585
BabelMain,
8686
], options: AngularEnvOptions): Promise<AngularBaseMain> {
87-
options.useAngularElementsPreview = true;
8887
options.useNgcc = false;
8988
const angularv14Env = new AngularV14Env(
9089
jestAspect,

scopes/versions/angular-v14/angular-v14.webpack.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -124,9 +124,9 @@ export class AngularV14Webpack extends AngularBaseWebpack {
124124
baseHref: angularOptions.baseHref ?? './',
125125
preserveSymlinks: false,
126126
outputPath: 'public', // doesn't matter because it will be deleted from the config
127-
index: angularOptions.index ?? join(sourceRoot, `index.html`),
128-
main: angularOptions.main ?? join(sourceRoot, `main.ts`),
129-
polyfills: angularOptions.polyfills ?? join(sourceRoot, `polyfills.ts`),
127+
index: angularOptions.index ?? `./${join(sourceRoot, `index.html`)}`,
128+
main: angularOptions.main ?? `./${join(sourceRoot, `main.ts`)}`,
129+
polyfills: angularOptions.polyfills ?? `./${join(sourceRoot, `polyfills.ts`)}`,
130130
tsConfig: angularOptions.tsConfig ?? tsconfigPath,
131131
assets: [...new Set([path.posix.join(sourceRoot, `assets/**/*`), ...(angularOptions.assets ?? [])])], // using set to remove duplicates
132132
styles: [...new Set([path.posix.join(sourceRoot, `styles.scss`), ...(angularOptions.styles ?? [])])], // using set to remove duplicates
@@ -140,7 +140,7 @@ export class AngularV14Webpack extends AngularBaseWebpack {
140140
sourceMap: angularOptions.sourceMap ?? true,
141141
outputHashing: angularOptions.outputHashing ?? (setup === WebpackSetup.Build ? OutputHashing.All : OutputHashing.None),
142142
watch: setup === WebpackSetup.Serve,
143-
allowedCommonJsDependencies: ['@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
143+
allowedCommonJsDependencies: ['dompurify', '@teambit/harmony', 'graphql', '@teambit/documenter.ng.content.copy-box', ...(angularOptions.allowedCommonJsDependencies || [])],
144144
};
145145
const normalizedWorkspaceRoot = normalize(workspaceRoot);
146146
const projectRoot = normalize('');

scopes/versions/angular-v14/component.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,9 @@
4040
"@jest/globals": "^28.0.0",
4141
"@ngtools/webpack": "~14.0.2",
4242
"@teambit/toolbox.performance.v8-cache": "0.0.3",
43+
"@teambit/ui-foundation.ui.constants.z-indexes": "0.0.498",
44+
"@teambit/webpack.modules.generate-style-loaders": "0.0.110",
45+
"@teambit/webpack.modules.style-regexps": "0.0.139",
4346
"@types/jest": "^28.0.0",
4447
"@types/react-dev-utils": "~9.0.8",
4548
"@types/remark-prism": "~1.3.0",
@@ -52,13 +55,18 @@
5255
"jest": "^28.0.0",
5356
"jest-preset-angular": "~12.1.0",
5457
"ng-packagr": "~14.0.2",
58+
"postcss": "8.4.18",
59+
"postcss-flexbugs-fixes": "5.0.2",
60+
"postcss-loader": "7.0.1",
61+
"postcss-preset-env": "7.8.2",
5562
"react-dev-utils": "10.2.1",
5663
"remark": "~13.0.0",
5764
"remark-frontmatter": "~3.0.0",
5865
"remark-html": "13.0.1",
5966
"remark-loader": "~4.0.0",
6067
"remark-prism": "~1.3.6",
6168
"rxjs": "~7.4.0",
69+
"style-loader": "^2.0.0",
6270
"ts-node": "^9.1.1",
6371
"tslib": "^2.3.0",
6472
"typescript": "~4.7.2",

scopes/versions/angular-v14/webpack/webpack5.build.config.ts

Lines changed: 3 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,13 @@
11
import {
22
AngularEnvOptions,
33
BitDedupeModuleResolvePlugin,
4+
getModuleRulesConfig,
45
WebpackConfig,
56
WebpackPlugin
67
} from '@teambit/angular-base';
78
import { fallbacks, fallbacksAliases, fallbacksProvidePluginConfig } from '@teambit/webpack';
89
import { sep } from 'path';
9-
import RemarkFrontmatter from 'remark-frontmatter';
10-
import RemarkHTML from 'remark-html';
11-
import RemarkPrism from 'remark-prism';
12-
import webpack from 'webpack';
10+
import webpack from 'webpack';
1311

1412
export function webpack5BuildConfigFactory(
1513
entryFiles: string[],
@@ -52,25 +50,7 @@ export function webpack5BuildConfigFactory(
5250
},
5351

5452
module: {
55-
rules: [
56-
{
57-
test: /\.md$/,
58-
use: [
59-
{
60-
loader: 'html-loader',
61-
},
62-
{
63-
loader: 'remark-loader',
64-
options: {
65-
removeFrontMatter: false,
66-
remarkOptions: {
67-
plugins: [RemarkPrism, RemarkHTML, RemarkFrontmatter],
68-
},
69-
},
70-
},
71-
],
72-
},
73-
],
53+
rules: getModuleRulesConfig(true),
7454
},
7555

7656
plugins: [

0 commit comments

Comments
 (0)