diff --git a/integration/bazel-schematics/disable-ivy.js b/integration/bazel-schematics/disable-ivy.js deleted file mode 100644 index b1b3c5b963..0000000000 --- a/integration/bazel-schematics/disable-ivy.js +++ /dev/null @@ -1,17 +0,0 @@ -/** - * @license - * Copyright Google Inc. All Rights Reserved. - * - * Use of this source code is governed by an MIT-style license that can be - * found in the LICENSE file at https://angular.io/license - */ - -const fs = require('fs'); -const configPath = 'demo/tsconfig.json'; -const config = { - ...JSON.parse(fs.readFileSync(configPath, 'utf8')), - "angularCompilerOptions": { - "enableIvy": false, - }, -}; -fs.writeFileSync(configPath, JSON.stringify(config, null, 2)); diff --git a/integration/bazel-schematics/test.sh b/integration/bazel-schematics/test.sh index bfda881a92..e4d665205c 100755 --- a/integration/bazel-schematics/test.sh +++ b/integration/bazel-schematics/test.sh @@ -32,7 +32,6 @@ function testBazel() { rm -rf demo # Create project ng new demo --collection=@angular/bazel --routing --skip-git --skip-install --style=scss - node ./disable-ivy.js cd demo installLocalPackages ng generate component widget --style=css diff --git a/integration/bazel-schematics/yarn.lock b/integration/bazel-schematics/yarn.lock index d98198fd71..2bf718a64a 100644 --- a/integration/bazel-schematics/yarn.lock +++ b/integration/bazel-schematics/yarn.lock @@ -2,18 +2,18 @@ # yarn lockfile v1 -"@angular-devkit/architect@0.900.0-next.11": - version "0.900.0-next.11" - resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.900.0-next.11.tgz#c1b1f6b428903eedf70422b34471d80a1243a682" - integrity sha512-SHgxd0tou/xlBG5XTPa//l0h1czxV0CUzMQ/QoMNin0n11JXFCIBooUzg5kguR8g4LvwzTAhHIx3ZVpypTOMtQ== +"@angular-devkit/architect@0.900.0-next.15": + version "0.900.0-next.15" + resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.900.0-next.15.tgz#d7e2b929a4d78a2318adfdbf67b4167ea59fe5d4" + integrity sha512-hNcguzc/fojhAWUJHA0K0VxdUY68auDMs2Jfmlxywgv2r6WJuzpdqn+ZfOdQz6mPKVEWkaRtR3and80oJQAc5w== dependencies: - "@angular-devkit/core" "9.0.0-next.11" + "@angular-devkit/core" "9.0.0-next.15" rxjs "6.5.3" -"@angular-devkit/core@9.0.0-next.11": - version "9.0.0-next.11" - resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-9.0.0-next.11.tgz#b8988c1fbfc3c42600dd5f9127cdfff4d14985b9" - integrity sha512-e95eStdGjt4waesu/E3D/J2T3AHucmovUXov/iURZCvzlzG6jCXvwWVsRh7Zk7OWqUBvyCZ5T1cn7lAPc5UW6A== +"@angular-devkit/core@9.0.0-next.15": + version "9.0.0-next.15" + resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-9.0.0-next.15.tgz#5f640139a7afa03af6011a768d84e702372eb045" + integrity sha512-wCx6ec5eI9tyTQLNdnLXJ2NNH8Rhey6Yb8I8nAlymEHxZG8d/OvpNRq3GklwVM+I75cLDguAbWMmWGbD02tR3w== dependencies: ajv "6.10.2" fast-json-stable-stringify "2.0.0" @@ -21,29 +21,29 @@ rxjs "6.5.3" source-map "0.7.3" -"@angular-devkit/schematics@9.0.0-next.11": - version "9.0.0-next.11" - resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-9.0.0-next.11.tgz#bb3659f1ee677db969ced806da7a8857a08633c8" - integrity sha512-853PB1+6dQLgNI6DSFmsFFR6H3ivWcEjyCQWyC74OvwtCGl8ZvrJuJLUy7TQB2f7ygkRqyaJMV7PhNpk3dw+vg== +"@angular-devkit/schematics@9.0.0-next.15": + version "9.0.0-next.15" + resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-9.0.0-next.15.tgz#0a39e4a78860e5e65660025c58e60bc9d4bf9cf7" + integrity sha512-0hfIyC5TP88wOzjKnQgXAI+BaW6JJPY7yinxBS35rowiwB1XWPcWRFacFXuyfLQRv48JXt17voOz+OH2iHRA5A== dependencies: - "@angular-devkit/core" "9.0.0-next.11" + "@angular-devkit/core" "9.0.0-next.15" rxjs "6.5.3" "@angular/bazel@file:../../dist/packages-dist/bazel": - version "0.0.0" + version "9.0.0-next.13" dependencies: "@microsoft/api-extractor" "^7.3.9" shelljs "0.8.2" tsickle "^0.37.0" "@angular/cli@file:../../node_modules/@angular/cli": - version "9.0.0-next.11" + version "9.0.0-next.15" dependencies: - "@angular-devkit/architect" "0.900.0-next.11" - "@angular-devkit/core" "9.0.0-next.11" - "@angular-devkit/schematics" "9.0.0-next.11" - "@schematics/angular" "9.0.0-next.11" - "@schematics/update" "0.900.0-next.11" + "@angular-devkit/architect" "0.900.0-next.15" + "@angular-devkit/core" "9.0.0-next.15" + "@angular-devkit/schematics" "9.0.0-next.15" + "@schematics/angular" "9.0.0-next.15" + "@schematics/update" "0.900.0-next.15" "@yarnpkg/lockfile" "1.1.0" ansi-colors "4.1.1" debug "^4.1.1" @@ -51,9 +51,10 @@ inquirer "7.0.0" npm-package-arg "6.1.1" npm-pick-manifest "3.0.2" - open "6.4.0" + open "7.0.0" pacote "9.5.8" read-package-tree "5.3.1" + rimraf "3.0.0" semver "6.3.0" symbol-observable "1.2.0" universal-analytics "^0.4.20" @@ -141,21 +142,21 @@ resolved "https://registry.yarnpkg.com/@microsoft/tsdoc/-/tsdoc-0.12.14.tgz#0e0810a0a174e50e22dfe8edb30599840712f22d" integrity sha512-518yewjSga1jLdiLrcmpMFlaba5P+50b0TWNFUpC+SL9Yzf0kMi57qw+bMl+rQ08cGqH1vLx4eg9YFUbZXgZ0Q== -"@schematics/angular@9.0.0-next.11": - version "9.0.0-next.11" - resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-9.0.0-next.11.tgz#166e7d8ef0d1992831dd88820c7a519ca5ab6c80" - integrity sha512-fAA2jnT4NzO286FtoqYjxugRe1wq69o1SpuKtFXbIvFGvPPQdv1/UlNGjDkuURT7SiNRuLLALOqyFXh2LC9vXg== +"@schematics/angular@9.0.0-next.15": + version "9.0.0-next.15" + resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-9.0.0-next.15.tgz#0247585ff7cdb9bdd108525f845e0ba0890b5ffc" + integrity sha512-Xc8Kvmk1s65h9AoaeN/CMuSMkzDnnarBrglk1MNOfD1y/WMmmJGLhcv+cOiTavJGFJNFv+iJmE8FJR6sDga3Wg== dependencies: - "@angular-devkit/core" "9.0.0-next.11" - "@angular-devkit/schematics" "9.0.0-next.11" + "@angular-devkit/core" "9.0.0-next.15" + "@angular-devkit/schematics" "9.0.0-next.15" -"@schematics/update@0.900.0-next.11": - version "0.900.0-next.11" - resolved "https://registry.yarnpkg.com/@schematics/update/-/update-0.900.0-next.11.tgz#235c895e8ebbbf92d1e33fa2e1be5ece407c12cf" - integrity sha512-qZ/Ry3ckREcM0rCr0JUy+I076P9lSRZ8e3dgKb5lsehdP1YqNkDO+mRtbbsKD37+YlPFIOigA7OYkcol78862Q== +"@schematics/update@0.900.0-next.15": + version "0.900.0-next.15" + resolved "https://registry.yarnpkg.com/@schematics/update/-/update-0.900.0-next.15.tgz#c86ea5c7e43c8bf39020d3861d58154edf3007c5" + integrity sha512-3FQK9hc/LIBY2D9+5MCdg7SfmAvOBh6XyKpN6aoX4GHNm8v5Yn74XZM6h3PWbIPK94EI8x/H7H/ZbXFkrOUUUA== dependencies: - "@angular-devkit/core" "9.0.0-next.11" - "@angular-devkit/schematics" "9.0.0-next.11" + "@angular-devkit/core" "9.0.0-next.15" + "@angular-devkit/schematics" "9.0.0-next.15" "@yarnpkg/lockfile" "1.1.0" ini "1.3.5" pacote "9.5.8" @@ -967,10 +968,10 @@ is-typedarray@~1.0.0: resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a" integrity sha1-5HnICFjfDBsR3dppQPlgEfzaSpo= -is-wsl@^1.1.0: - version "1.1.0" - resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-1.1.0.tgz#1f16e4aa22b04d1336b66188a66af3c600c3a66d" - integrity sha1-HxbkqiKwTRM2tmGIpmrzxgDDpm0= +is-wsl@^2.1.0: + version "2.1.1" + resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-2.1.1.tgz#4a1c152d429df3d441669498e2486d3596ebaf1d" + integrity sha512-umZHcSrwlDHo2TGMXv0DZ8dIUGunZ2Iv68YZnrmCiBPkZ4aaOhtv7pXJKeki9k3qJ3RJr0cDyitcl5wEH3AYog== isarray@~1.0.0: version "1.0.0" @@ -1303,12 +1304,12 @@ onetime@^5.1.0: dependencies: mimic-fn "^2.1.0" -open@6.4.0: - version "6.4.0" - resolved "https://registry.yarnpkg.com/open/-/open-6.4.0.tgz#5c13e96d0dc894686164f18965ecfe889ecfc8a9" - integrity sha512-IFenVPgF70fSm1keSd2iDBIDIBZkroLeuffXq+wKTzTJlBpesFWojV9lb8mzOfaAzM1sr7HQHuO0vtV0zYekGg== +open@7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/open/-/open-7.0.0.tgz#7e52999b14eb73f90f0f0807fe93897c4ae73ec9" + integrity sha512-K6EKzYqnwQzk+/dzJAQSBORub3xlBTxMz+ntpZpH/LyCa1o6KjXhuN+2npAaI9jaSmU3R1Q8NWf4KUWcyytGsQ== dependencies: - is-wsl "^1.1.0" + is-wsl "^2.1.0" os-homedir@^1.0.0: version "1.0.2" @@ -1561,6 +1562,13 @@ retry@^0.10.0: resolved "https://registry.yarnpkg.com/retry/-/retry-0.10.1.tgz#e76388d217992c252750241d3d3956fed98d8ff4" integrity sha1-52OI0heZLCUnUCQdPTlW/tmNj/Q= +rimraf@3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.0.tgz#614176d4b3010b75e5c390eb0ee96f6dc0cebb9b" + integrity sha512-NDGVxTsjqfunkds7CqsOiEnxln4Bo7Nddl3XhS4pXg5OzwkLqJ971ZVAAnB+DDLnF76N+VnDEiBHaVV8I06SUg== + dependencies: + glob "^7.1.3" + rimraf@^2.5.4, rimraf@^2.6.2: version "2.6.3" resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.3.tgz#b2d104fe0d8fb27cf9e0a1cda8262dd3833c6cab" diff --git a/packages/bazel/src/builders/files/__dot__bazelrc.template b/packages/bazel/src/builders/files/__dot__bazelrc.template index 881f1e8ccf..6cbfc89ca5 100644 --- a/packages/bazel/src/builders/files/__dot__bazelrc.template +++ b/packages/bazel/src/builders/files/__dot__bazelrc.template @@ -27,8 +27,9 @@ build --incompatible_bzl_disallow_load_after_statement=false test --test_output=errors -# Use the Angular 6 compiler -build --define=compile=legacy +# Use the Angular Ivy compiler +# See https://github.com/angular/angular/blob/master/docs/BAZEL.md#various-flags-used-for-tests +build --define=compile=aot # Temporary define while angular depends on the legacy rollup_bundle rule. # TODO: remove this setting after https://github.com/angular/angular/pull/33201 lands. diff --git a/packages/bazel/src/builders/files/src/BUILD.bazel.template b/packages/bazel/src/builders/files/src/BUILD.bazel.template index ea9f10ad0b..95f8d1cc4f 100644 --- a/packages/bazel/src/builders/files/src/BUILD.bazel.template +++ b/packages/bazel/src/builders/files/src/BUILD.bazel.template @@ -2,9 +2,10 @@ package(default_visibility = ["//visibility:public"]) load("@npm_angular_bazel//:index.bzl", "ng_module") load("@npm_bazel_karma//:index.bzl", "ts_web_test_suite") -load("@build_bazel_rules_nodejs//:index.bzl", "rollup_bundle") load("@build_bazel_rules_nodejs//internal/web_package:web_package.bzl", "web_package") load("@npm//history-server:index.bzl", "history_server") +load("@npm_bazel_rollup//:index.bzl", "rollup_bundle") +load("@npm_bazel_terser//:index.bzl", "terser_minified") load("@npm_bazel_typescript//:index.bzl", "ts_devserver", "ts_library") load("@io_bazel_rules_sass//:defs.bzl", "multi_sass_binary", "sass_binary") @@ -48,21 +49,26 @@ ng_module( rollup_bundle( name = "bundle", - enable_code_splitting = False, + config_file = "rollup.config.js", entry_point = ":main.prod.ts", deps = [ "//src", - "@npm//@angular/router", - "@npm//rxjs", + "@npm//rollup-plugin-commonjs", + "@npm//rollup-plugin-node-resolve", ], ) +terser_minified( + name = "bundle.min", + src = ":bundle", +) + web_package( name = "prodapp", assets = [ # do not sort "@npm//:node_modules/zone.js/dist/zone.min.js", - ":bundle.min.js", + ":bundle.min", ":global_stylesheet", ], data = [ diff --git a/packages/bazel/src/schematics/ng-add/files/angular-metadata.tsconfig.json.template b/packages/bazel/src/schematics/ng-add/files/angular-metadata.tsconfig.json.template deleted file mode 100644 index d502e672e9..0000000000 --- a/packages/bazel/src/schematics/ng-add/files/angular-metadata.tsconfig.json.template +++ /dev/null @@ -1,29 +0,0 @@ -// Workaround for https://github.com/angular/angular/issues/18810 -// This file is required because when using the Angular NPM packages and building -// with AOT compilation, NGC needs the "ngsummary.json" files. -{ - "compilerOptions": { - "lib": [ - "dom", - "es2015" - ], - "experimentalDecorators": true, - "types": [], - "module": "amd", - "moduleResolution": "node" - }, - "angularCompilerOptions": { - "enableIvy": false - }, - "include": [ - "node_modules/@angular/**/*" - ], - "exclude": [ - "node_modules/@angular/bazel/**", - "node_modules/@angular/**/schematics/**", - "node_modules/@angular/**/testing/**", - "node_modules/@angular/compiler-cli/**", - "node_modules/@angular/common/upgrade*", - "node_modules/@angular/router/upgrade*" - ] -} diff --git a/packages/bazel/src/schematics/ng-add/files/src/main.dev.ts.template b/packages/bazel/src/schematics/ng-add/files/src/main.dev.ts.template index 32bd701bdf..1f8eb00fe9 100644 --- a/packages/bazel/src/schematics/ng-add/files/src/main.dev.ts.template +++ b/packages/bazel/src/schematics/ng-add/files/src/main.dev.ts.template @@ -1,4 +1,4 @@ import {platformBrowser} from '@angular/platform-browser'; -import {AppModuleNgFactory} from './app/app.module.ngfactory'; +import {AppModule} from './app/app.module'; -platformBrowser().bootstrapModuleFactory(AppModuleNgFactory); +platformBrowser().bootstrapModule(AppModule); diff --git a/packages/bazel/src/schematics/ng-add/files/src/main.prod.ts.template b/packages/bazel/src/schematics/ng-add/files/src/main.prod.ts.template index 70fd120dc5..b6fe69489e 100644 --- a/packages/bazel/src/schematics/ng-add/files/src/main.prod.ts.template +++ b/packages/bazel/src/schematics/ng-add/files/src/main.prod.ts.template @@ -1,6 +1,6 @@ import {enableProdMode} from '@angular/core'; import {platformBrowser} from '@angular/platform-browser'; -import {AppModuleNgFactory} from './app/app.module.ngfactory'; +import {AppModule} from './app/app.module'; enableProdMode(); -platformBrowser().bootstrapModuleFactory(AppModuleNgFactory); +platformBrowser().bootstrapModule(AppModule); diff --git a/packages/bazel/src/schematics/ng-add/files/src/rollup.config.js.template b/packages/bazel/src/schematics/ng-add/files/src/rollup.config.js.template new file mode 100644 index 0000000000..6f6d3727c5 --- /dev/null +++ b/packages/bazel/src/schematics/ng-add/files/src/rollup.config.js.template @@ -0,0 +1,11 @@ +const node = require('rollup-plugin-node-resolve'); +const commonjs = require('rollup-plugin-commonjs'); + +module.exports = { + plugins: [ + node({ + mainFields: ['browser', 'es2015', 'module', 'jsnext:main', 'main'], + }), + commonjs(), + ], +}; diff --git a/packages/bazel/src/schematics/ng-add/index.ts b/packages/bazel/src/schematics/ng-add/index.ts index 4d54e5ffd4..fcff5c06d2 100644 --- a/packages/bazel/src/schematics/ng-add/index.ts +++ b/packages/bazel/src/schematics/ng-add/index.ts @@ -52,8 +52,14 @@ function addDevDependenciesToPackageJson(options: Schema) { '@bazel/ibazel': '^0.10.2', '@bazel/karma': '0.39.0', '@bazel/protractor': '0.39.0', + '@bazel/rollup': '0.39.0', + '@bazel/terser': '0.39.0', '@bazel/typescript': '0.39.0', 'history-server': '^1.3.1', + 'rollup': '^1.25.2', + 'rollup-plugin-commonjs': '^10.1.0', + 'rollup-plugin-node-resolve': '^5.2.0', + 'terser': '^4.3.9', }; const recorder = host.beginUpdate(packageJson); @@ -310,15 +316,11 @@ function upgradeRxjs() { } /** - * When using Angular NPM packages and building with AOT compilation, ngc - * requires ngsumamry files but they are not shipped. This function adds a - * postinstall step to generate these files. + * When using Ivy, ngcc must be run as a postinstall step. + * This function adds this postinstall step. */ -function addPostinstallToGenerateNgSummaries() { +function addPostinstallToRunNgcc() { return (host: Tree, context: SchematicContext) => { - if (!host.exists('angular-metadata.tsconfig.json')) { - return; - } const packageJson = 'package.json'; if (!host.exists(packageJson)) { throw new Error(`Could not find ${packageJson}`); @@ -333,19 +335,29 @@ function addPostinstallToGenerateNgSummaries() { } const scripts = findPropertyInAstObject(jsonAst, 'scripts') as JsonAstObject; const recorder = host.beginUpdate(packageJson); - const ngcCommand = 'ngc -p ./angular-metadata.tsconfig.json'; + // For bazel we need to compile the all files in place so we + // don't use `--first-only` or `--create-ivy-entry-points` + const ngccCommand = 'ngcc --properties es2015 browser module main'; if (scripts) { const postInstall = findPropertyInAstObject(scripts, 'postinstall'); - if (postInstall) { - const command = `${postInstall.value}; ${ngcCommand}`; - replacePropertyInAstObject(recorder, scripts, 'postinstall', command); + if (postInstall && postInstall.value) { + let value = postInstall.value as string; + if (/\bngcc\b/.test(value)) { + // `ngcc` is already in the postinstall script + value = + value.replace(/\s*--first-only\b/, '').replace(/\s*--create-ivy-entry-points\b/, ''); + replacePropertyInAstObject(recorder, scripts, 'postinstall', value); + } else { + const command = `${postInstall.value}; ${ngccCommand}`; + replacePropertyInAstObject(recorder, scripts, 'postinstall', command); + } } else { - insertPropertyInAstObjectInOrder(recorder, scripts, 'postinstall', ngcCommand, 4); + insertPropertyInAstObjectInOrder(recorder, scripts, 'postinstall', ngccCommand, 4); } } else { insertPropertyInAstObjectInOrder( recorder, jsonAst, 'scripts', { - postinstall: ngcCommand, + postinstall: ngccCommand, }, 2); } @@ -377,7 +389,7 @@ export default function(options: Schema): Rule { addFilesRequiredByBazel(options), addDevDependenciesToPackageJson(options), removeObsoleteDependenciesFromPackageJson(options), - addPostinstallToGenerateNgSummaries(), + addPostinstallToRunNgcc(), backupAngularJson(), updateAngularJsonToUseBazelBuilder(options), updateGitignore(), diff --git a/packages/bazel/src/schematics/ng-add/index_spec.ts b/packages/bazel/src/schematics/ng-add/index_spec.ts index 0ad9ebf1e4..e89f160c20 100644 --- a/packages/bazel/src/schematics/ng-add/index_spec.ts +++ b/packages/bazel/src/schematics/ng-add/index_spec.ts @@ -165,7 +165,20 @@ describe('ng-add schematic', () => { const content = host.readContent('/package.json'); const json = JSON.parse(content); expect(json.scripts['postinstall']) - .toBe('angular rocks; ngc -p ./angular-metadata.tsconfig.json'); + .toBe('angular rocks; ngcc --properties es2015 browser module main'); + }); + + it('should update ngcc in scripts.postinstall if it already exists', async() => { + const packageJson = JSON.parse(host.readContent('/package.json')); + packageJson['scripts'] = { + postinstall: + 'ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points', + }; + host.overwrite('/package.json', JSON.stringify(packageJson)); + host = await schematicRunner.runSchematicAsync('ng-add', defaultOptions, host).toPromise(); + const content = host.readContent('/package.json'); + const json = JSON.parse(content); + expect(json.scripts['postinstall']).toBe('ngcc --properties es2015 browser module main'); }); it('should not create Bazel workspace file', async() => { @@ -298,7 +311,7 @@ describe('ng-add schematic', () => { expect(host.files).toContain('/package.json'); const content = host.readContent('/package.json'); const json = JSON.parse(content); - expect(json.scripts.postinstall).toBe('ngc -p ./angular-metadata.tsconfig.json'); + expect(json.scripts.postinstall).toBe('ngcc --properties es2015 browser module main'); }); it('should work when run on a minimal project (without test and e2e targets)', async() => {