Skip to content

Commit

Permalink
feat(angular): support for Angular 15 (#12112)
Browse files Browse the repository at this point in the history
  • Loading branch information
Coly010 authored Nov 17, 2022
1 parent 032a9d1 commit b084ddd
Show file tree
Hide file tree
Showing 51 changed files with 2,103 additions and 1,634 deletions.
16 changes: 4 additions & 12 deletions e2e/angular-core/src/ng-add.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -184,13 +184,13 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
// check project configuration
const projectConfig = readJson(`apps/${project}/project.json`);
expect(projectConfig.sourceRoot).toEqual(`apps/${project}/src`);
expect(projectConfig.targets.build).toEqual({
expect(projectConfig.targets.build).toStrictEqual({
executor: '@angular-devkit/build-angular:browser',
options: {
outputPath: `dist/apps/${project}`,
index: `apps/${project}/src/index.html`,
main: `apps/${project}/src/main.ts`,
polyfills: `apps/${project}/src/polyfills.ts`,
polyfills: [`zone.js`],
tsConfig: `apps/${project}/tsconfig.app.json`,
assets: [
`apps/${project}/src/favicon.ico`,
Expand All @@ -201,12 +201,6 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
},
configurations: {
production: {
fileReplacements: [
{
replace: `apps/${project}/src/environments/environment.ts`,
with: `apps/${project}/src/environments/environment.prod.ts`,
},
],
budgets: [
{
type: 'initial',
Expand Down Expand Up @@ -240,13 +234,11 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
},
defaultConfiguration: 'development',
});
expect(projectConfig.targets.test).toEqual({
expect(projectConfig.targets.test).toStrictEqual({
executor: '@angular-devkit/build-angular:karma',
options: {
main: `apps/${project}/src/test.ts`,
polyfills: `apps/${project}/src/polyfills.ts`,
polyfills: [`zone.js`, `zone.js/testing`],
tsConfig: `apps/${project}/tsconfig.spec.json`,
karmaConfig: `apps/${project}/karma.conf.js`,
assets: [
`apps/${project}/src/favicon.ico`,
`apps/${project}/src/assets`,
Expand Down
8 changes: 0 additions & 8 deletions e2e/angular-extensions/src/misc.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,6 @@ describe('Move Angular Project', () => {

// just check the output
expect(moveOutput).toContain(`DELETE apps/${app1}`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/.browserslistrc`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/jest.config.ts`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/tsconfig.app.json`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/tsconfig.json`);
Expand All @@ -44,7 +43,6 @@ describe('Move Angular Project', () => {
expect(moveOutput).toContain(`CREATE apps/${newPath}/src/favicon.ico`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/src/index.html`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/src/main.ts`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/src/polyfills.ts`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/src/styles.css`);
expect(moveOutput).toContain(`CREATE apps/${newPath}/src/test-setup.ts`);
expect(moveOutput).toContain(
Expand All @@ -54,12 +52,6 @@ describe('Move Angular Project', () => {
`CREATE apps/${newPath}/src/app/app.module.ts`
);
expect(moveOutput).toContain(`CREATE apps/${newPath}/src/assets/.gitkeep`);
expect(moveOutput).toContain(
`CREATE apps/${newPath}/src/environments/environment.prod.ts`
);
expect(moveOutput).toContain(
`CREATE apps/${newPath}/src/environments/environment.ts`
);
});

/**
Expand Down
27 changes: 14 additions & 13 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,19 +26,19 @@
"echo": "echo 123458"
},
"devDependencies": {
"@angular-devkit/architect": "~0.1402.0",
"@angular-devkit/build-angular": "~14.2.0",
"@angular-devkit/core": "~14.2.0",
"@angular-devkit/schematics": "~14.2.0",
"@angular-devkit/architect": "~0.1500.0",
"@angular-devkit/build-angular": "~15.0.0",
"@angular-devkit/core": "~15.0.0",
"@angular-devkit/schematics": "~15.0.0",
"@angular-eslint/eslint-plugin": "~14.0.4",
"@angular-eslint/eslint-plugin-template": "~14.0.4",
"@angular-eslint/template-parser": "~14.0.4",
"@angular/cli": "~14.2.0",
"@angular/common": "~14.2.0",
"@angular/compiler": "~14.2.0",
"@angular/compiler-cli": "~14.2.0",
"@angular/core": "~14.2.0",
"@angular/router": "~14.2.0",
"@angular/cli": "~15.0.0",
"@angular/common": "~15.0.0",
"@angular/compiler": "~15.0.0",
"@angular/compiler-cli": "~15.0.0",
"@angular/core": "~15.0.0",
"@angular/router": "~15.0.0",
"@babel/core": "^7.15.0",
"@babel/helper-create-regexp-features-plugin": "^7.14.5",
"@babel/preset-typescript": "^7.15.0",
Expand Down Expand Up @@ -74,7 +74,7 @@
"@rollup/plugin-image": "^2.1.0",
"@rollup/plugin-json": "^4.1.0",
"@rollup/plugin-node-resolve": "^13.0.4",
"@schematics/angular": "~14.2.0",
"@schematics/angular": "~15.0.0",
"@storybook/addon-essentials": "~6.5.9",
"@storybook/angular": "^6.5.12",
"@storybook/builder-webpack5": "~6.5.9",
Expand Down Expand Up @@ -121,6 +121,7 @@
"autoprefixer": "10.4.12",
"babel-jest": "28.1.3",
"babel-loader": "^8.2.2",
"browserslist": "^4.21.4",
"chalk": "4.1.0",
"chokidar": "^3.5.1",
"commitizen": "^4.0.3",
Expand Down Expand Up @@ -185,7 +186,7 @@
"mini-css-extract-plugin": "~2.4.7",
"minimatch": "3.0.5",
"next-sitemap": "^3.1.10",
"ng-packagr": "~14.2.0",
"ng-packagr": "~15.0.0",
"node-fetch": "^2.6.7",
"nx": "15.1.0-beta.2",
"open": "^8.4.0",
Expand Down Expand Up @@ -241,7 +242,7 @@
"url-loader": "^4.1.1",
"verdaccio": "^5.0.4",
"vite": "^3.2.3",
"webpack": "^5.58.1",
"webpack": "^5.75.0",
"webpack-dev-server": "^4.9.3",
"webpack-merge": "^5.8.0",
"webpack-node-externals": "^3.0.0",
Expand Down
93 changes: 93 additions & 0 deletions packages/angular/migrations.json
Original file line number Diff line number Diff line change
Expand Up @@ -190,6 +190,42 @@
"version": "15.0.0-beta.1",
"description": "Stop hashing karma spec files and config files for build targets and dependent tasks",
"factory": "./src/migrations/update-15-0-0/add-karma-inputs"
},
"update-angular-cli-version-15-0-0": {
"cli": "nx",
"version": "15.2.0-beta.0",
"description": "Update the @angular/cli package version to ~15.0.0.",
"factory": "./src/migrations/update-15-2-0/update-angular-cli"
},
"remove-browserlist-config": {
"cli": "nx",
"version": "15.2.0-beta.0",
"description": "Remove browserlist config as it's handled by build-angular",
"factory": "./src/migrations/update-15-2-0/remove-browserlist-config"
},
"update-typescript-target": {
"cli": "nx",
"version": "15.2.0-beta.0",
"description": "Update typescript target to ES2022",
"factory": "./src/migrations/update-15-2-0/update-typescript-target"
},
"update-workspace-config": {
"cli": "nx",
"version": "15.2.0-beta.0",
"description": "Remove bundleDependencies from server targets",
"factory": "./src/migrations/update-15-2-0/update-workspace-config"
},
"update-platform-server-exports": {
"cli": "ng",
"version": "15.2.0-beta.0",
"description": "Remove exported `@angular/platform-server` `renderModule` method. The `renderModule` method is now exported by the Angular CLI.",
"factory": "./src/migrations/update-15-2-0/remove-platform-server-exports"
},
"update-karma-main-file": {
"cli": "ng",
"version": "15.2.0-beta.0",
"description": "Remove no longer needed require calls in Karma builder main file.",
"factory": "./src/migrations/update-15-2-0/update-karma-main-file"
}
},
"packageJsonUpdates": {
Expand Down Expand Up @@ -1557,6 +1593,63 @@
"alwaysAddToPackageJson": false
}
}
},
"15.2.0": {
"version": "15.2.0-beta.0",
"packages": {
"@angular-devkit/architect": {
"version": "~0.1500.0",
"alwaysAddToPackageJson": false
},
"@angular-devkit/build-angular": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"@angular-devkit/build-webpack": {
"version": "~0.1500.0",
"alwaysAddToPackageJson": false
},
"@angular-devkit/core": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"@angular-devkit/schematics": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"@schematics/angular": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"@angular/core": {
"version": "~15.0.0",
"alwaysAddToPackageJson": true
},
"@angular/material": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"@angular/cdk": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"@nguniversal/common": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"@nguniversal/express-engine": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"@nguniversal/builders": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
},
"ng-packagr": {
"version": "~15.0.0",
"alwaysAddToPackageJson": false
}
}
}
}
}
6 changes: 3 additions & 3 deletions packages/angular/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
"migrations": "./migrations.json"
},
"dependencies": {
"@angular-devkit/schematics": "~14.2.0",
"@angular-devkit/schematics": "~15.0.0",
"@nrwl/cypress": "file:../cypress",
"@nrwl/devkit": "file:../devkit",
"@nrwl/jest": "file:../jest",
Expand All @@ -48,7 +48,7 @@
"@nrwl/webpack": "file:../webpack",
"@nrwl/workspace": "file:../workspace",
"@phenomnomnominal/tsquery": "4.1.1",
"@schematics/angular": "~14.2.0",
"@schematics/angular": "~15.0.0",
"chalk": "4.1.0",
"chokidar": "^3.5.1",
"http-server": "^14.1.0",
Expand All @@ -58,7 +58,7 @@
"semver": "7.3.4",
"ts-node": "10.9.1",
"tsconfig-paths": "^3.9.0",
"webpack": "^5.58.1",
"webpack": "^5.75.0",
"webpack-merge": "5.7.3"
},
"publishConfig": {
Expand Down
7 changes: 6 additions & 1 deletion packages/angular/plugins/component-testing.ts
Original file line number Diff line number Diff line change
Expand Up @@ -167,7 +167,12 @@ function normalizeBuildTargetOptions(
const buildOptions = withSchemaDefaults(options);

// paths need to be unix paths for angular devkit
buildOptions.polyfills = joinPathFragments(offset, buildOptions.polyfills);
buildOptions.polyfills =
Array.isArray(buildOptions.polyfills) && buildOptions.polyfills.length > 0
? (buildOptions.polyfills as string[]).map((p) =>
joinPathFragments(offset, p)
)
: joinPathFragments(offset, buildOptions.polyfills as string);
buildOptions.main = joinPathFragments(offset, buildOptions.main);
buildOptions.index =
typeof buildOptions.index === 'string'
Expand Down
18 changes: 16 additions & 2 deletions packages/angular/src/builders/webpack-browser/schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -37,8 +37,22 @@
"description": "The full path for the main entry point to the app, relative to the current workspace."
},
"polyfills": {
"type": "string",
"description": "The full path for the polyfills file, relative to the current workspace."
"description": "Polyfills to be included in the build.",
"oneOf": [
{
"type": "array",
"description": "A list of polyfills to include in the build. Can be a full path for a file, relative to the current workspace or module specifier. Example: 'zone.js'.",
"items": {
"type": "string",
"uniqueItems": true
},
"default": []
},
{
"type": "string",
"description": "The full path for the polyfills file, relative to the current workspace or a module specifier. Example: 'zone.js'."
}
]
},
"tsConfig": {
"type": "string",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import {
saveCacheEntry,
} from 'ng-packagr/lib/utils/cache';
import * as log from 'ng-packagr/lib/utils/log';
import { dirname, extname, join, resolve } from 'path';
import { dirname, extname, join } from 'path';
import * as postcssPresetEnv from 'postcss-preset-env';
import * as postcssUrl from 'postcss-url';
import {
Expand All @@ -26,6 +26,7 @@ import {
tailwindDirectives,
TailwindSetup,
} from '../../../utilities/tailwindcss';
import { pathToFileURL } from 'url';

const postcss = require('postcss');

Expand Down Expand Up @@ -250,12 +251,10 @@ export class StylesheetProcessor {
case '.sass':
case '.scss': {
return (await import('sass'))
.renderSync({
file: filePath,
data: css,
indentedSyntax: '.sass' === ext,
importer: customSassImporter,
includePaths: this.styleIncludePaths,
.compileString(css, {
url: pathToFileURL(filePath),
syntax: '.sass' === ext ? 'indented' : 'scss',
loadPaths: this.styleIncludePaths,
})
.css.toString();
}
Expand All @@ -271,27 +270,6 @@ export class StylesheetProcessor {

return content;
}
case '.styl':
case '.stylus': {
const stylus = (await import('stylus')).default;

return (
stylus(css)
// add paths for resolve
.set('paths', [
this.basePath,
'.',
...this.styleIncludePaths,
'node_modules',
])
// add support for resolving plugins from node_modules
.set('filename', filePath)
// turn on url resolver in stylus, same as flag --resolve-url
.set('resolve url', true)
.define('url', stylus.resolver(undefined))
.render()
);
}
case '.css':
default:
return css;
Expand Down Expand Up @@ -340,19 +318,3 @@ function transformSupportedBrowsersToTargets(

return transformed.length ? transformed : undefined;
}

function customSassImporter(
url: string,
prev: string
): { file: string; prev: string } | undefined {
// NB: Sass importer should always be sync as otherwise it will cause
// sass to go in the async path which is slower.
if (url[0] !== '~') {
return undefined;
}

return {
file: url.substring(1),
prev,
};
}
Loading

1 comment on commit b084ddd

@vercel
Copy link

@vercel vercel bot commented on b084ddd Nov 17, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

nx-dev – ./

nx-dev-nrwl.vercel.app
nx-dev-git-master-nrwl.vercel.app
nx-five.vercel.app
nx.dev

Please sign in to comment.