-
Notifications
You must be signed in to change notification settings - Fork 522
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(examples): build and consume an Angular workspace library (#1633)
* feat(examples): build and consume an Angular workspace library With this change we now build and consume an Angular library in the Angular application. * chore: update deleted packages * style: bazel lint * style: bazel lint * style: add comment for pkg_npm workaround Co-authored-by: Greg Magolan <gmagolan@gmail.com>
- Loading branch information
1 parent
13510ad
commit b459d6d
Showing
25 changed files
with
1,113 additions
and
33 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
87 changes: 87 additions & 0 deletions
87
examples/angular_bazel_architect/projects/frontend-lib/BUILD.bazel
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,87 @@ | ||
| load("@build_bazel_rules_nodejs//:index.bzl", "pkg_npm") | ||
| load("@npm//@angular-devkit/architect-cli:index.bzl", "architect", "architect_test") | ||
|
|
||
| package(default_visibility = ["//visibility:public"]) | ||
|
|
||
| architect( | ||
| name = "build", | ||
| args = [ | ||
| "frontend-lib:build", | ||
| "--", | ||
| "$(@D)", | ||
| ], | ||
| data = glob( | ||
| [ | ||
| "src/**/*", | ||
| ], | ||
| exclude = [ | ||
| "src/**/*.spec.ts", | ||
| "src/test.ts", | ||
| ], | ||
| ) + [ | ||
| "ng-package.js", | ||
| "package.json", | ||
| "tsconfig.lib.json", | ||
| "tsconfig.lib.prod.json", | ||
| "@angular_bazel_architect//:angular.json", | ||
| "@angular_bazel_architect//:tsconfig.json", | ||
| "@npm//@angular/cli", | ||
| "@npm//@angular/core", | ||
| "@npm//zone.js", | ||
| "@npm//tslib", | ||
| "@npm//typescript", | ||
| "@npm//@angular-devkit/architect-cli", | ||
| "@npm//@angular-devkit/build-ng-packagr", | ||
| ], | ||
| output_dir = True, | ||
| ) | ||
|
|
||
| architect_test( | ||
| name = "test", | ||
| args = ["frontend-lib:test"], | ||
| data = glob([ | ||
| "src/**/*", | ||
| ]) + [ | ||
| "karma.conf.js", | ||
| "tsconfig.spec.json", | ||
| "@angular_bazel_architect//:angular.json", | ||
| "@angular_bazel_architect//:tsconfig.json", | ||
| "@npm//@types/jasmine", | ||
| "@npm//@types/node", | ||
| "@npm//@angular/cli", | ||
| "@npm//@angular/core", | ||
| "@npm//@angular/platform-browser-dynamic", | ||
| "@npm//@angular-devkit/build-angular", | ||
| "@npm//tslib", | ||
| "@npm//typescript", | ||
| "@npm//zone.js", | ||
| "@npm//karma", | ||
| "@npm//karma-chrome-launcher", | ||
| "@npm//karma-coverage-istanbul-reporter", | ||
| "@npm//karma-jasmine", | ||
| "@npm//karma-jasmine-html-reporter", | ||
| ], | ||
| tags = [ | ||
| "browser:chromium-local", | ||
| # This fails locally on macos buildkite trying to capture Chrome. | ||
| # Tested locally on OSX and it works so it is something to do with the | ||
| # buildkite osx machine chrome version/configuration. | ||
| # ==================== Test output for //:test: | ||
| # 29 01 2020 23:31:42.804:INFO [karma-server]: Karma v4.1.0 server started at http://0.0.0.0:9876/ | ||
| # 29 01 2020 23:31:42.806:INFO [launcher]: Launching browsers ChromeHeadlessNoSandbox with concurrency unlimited | ||
| # 29 01 2020 23:31:42.808:INFO [launcher]: Starting browser ChromeHeadless | ||
| # 29 01 2020 23:32:42.815:WARN [launcher]: ChromeHeadless have not captured in 60000 ms, killing. | ||
| # 29 01 2020 23:32:44.818:WARN [launcher]: ChromeHeadless was not killed in 2000 ms, sending SIGKILL. | ||
| # 29 01 2020 23:32:46.822:WARN [launcher]: ChromeHeadless was not killed by SIGKILL in 2000 ms, continuing. | ||
| "no-bazelci-mac", | ||
| ], | ||
| ) | ||
|
|
||
| pkg_npm( | ||
| name = "npm_package", | ||
| package_name = "frontend-lib", | ||
| # This is a workaround for the Linker When using `output_dir = True`. | ||
| # the ':build' target dependency has an output directory so it will end up at 'npm_package/build' instead of | ||
| # the root of the pkg_npm output directory. | ||
| nested_packages = [":build"], | ||
| ) |
24 changes: 24 additions & 0 deletions
24
examples/angular_bazel_architect/projects/frontend-lib/README.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| # FrontendLib | ||
|
|
||
| This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.0. | ||
|
|
||
| ## Code scaffolding | ||
|
|
||
| Run `ng generate component component-name --project frontend-lib` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project frontend-lib`. | ||
| > Note: Don't forget to add `--project frontend-lib` or else it will be added to the default project in your `angular.json` file. | ||
| ## Build | ||
|
|
||
| Run `ng build frontend-lib` to build the project. The build artifacts will be stored in the `dist/` directory. | ||
|
|
||
| ## Publishing | ||
|
|
||
| After building your library with `ng build frontend-lib`, go to the dist folder `cd dist/frontend-lib` and run `npm publish`. | ||
|
|
||
| ## Running unit tests | ||
|
|
||
| Run `ng test frontend-lib` to execute the unit tests via [Karma](https://karma-runner.github.io). | ||
|
|
||
| ## Further help | ||
|
|
||
| To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). |
38 changes: 38 additions & 0 deletions
38
examples/angular_bazel_architect/projects/frontend-lib/karma.conf.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| // Karma configuration file, see link for more information | ||
| // https://karma-runner.github.io/1.0/config/configuration-file.html | ||
|
|
||
| module.exports = function (config) { | ||
| config.set({ | ||
| basePath: '', | ||
| frameworks: ['jasmine', '@angular-devkit/build-angular'], | ||
| plugins: [ | ||
| require('karma-jasmine'), | ||
| require('karma-chrome-launcher'), | ||
| require('karma-jasmine-html-reporter'), | ||
| require('karma-coverage-istanbul-reporter'), | ||
| require('@angular-devkit/build-angular/plugins/karma') | ||
| ], | ||
| client: { | ||
| clearContext: false // leave Jasmine Spec Runner output visible in browser | ||
| }, | ||
| coverageIstanbulReporter: { | ||
| dir: require('path').join(__dirname, '../../coverage/frontend-lib'), | ||
| reports: ['html', 'lcovonly', 'text-summary'], | ||
| fixWebpackSourcePaths: true | ||
| }, | ||
| reporters: ['progress', 'kjhtml'], | ||
| port: 9876, | ||
| colors: true, | ||
| logLevel: config.LOG_INFO, | ||
| autoWatch: true, | ||
| customLaunchers: { | ||
| ChromeHeadlessNoSandbox: { | ||
| base: 'ChromeHeadless', | ||
| flags: ['--no-sandbox', '--disable-gpu', '--disable-dev-shm-usage'] | ||
| } | ||
| }, | ||
| browsers: ['ChromeHeadlessNoSandbox'], | ||
| singleRun: false, | ||
| restartOnFileChange: true | ||
| }); | ||
| }; |
10 changes: 10 additions & 0 deletions
10
examples/angular_bazel_architect/projects/frontend-lib/ng-package.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
|
|
||
| const { resolve } = require('path'); | ||
|
|
||
| module.exports = { | ||
| dest: resolve(process.argv.pop()), | ||
| lib: { | ||
| entryFile: 'src/public-api.ts' | ||
| } | ||
| } | ||
|
|
9 changes: 9 additions & 0 deletions
9
examples/angular_bazel_architect/projects/frontend-lib/package.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| { | ||
| "name": "frontend-lib", | ||
| "version": "0.0.1", | ||
| "peerDependencies": { | ||
| "@angular/common": "^9.0.0", | ||
| "@angular/core": "^9.0.0", | ||
| "tslib": "^1.10.0" | ||
| } | ||
| } |
25 changes: 25 additions & 0 deletions
25
...ples/angular_bazel_architect/projects/frontend-lib/src/lib/frontend-lib.component.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
|
||
| import { FrontendLibComponent } from './frontend-lib.component'; | ||
|
|
||
| describe('FrontendLibComponent', () => { | ||
| let component: FrontendLibComponent; | ||
| let fixture: ComponentFixture<FrontendLibComponent>; | ||
|
|
||
| beforeEach(async(() => { | ||
| TestBed.configureTestingModule({ | ||
| declarations: [ FrontendLibComponent ] | ||
| }) | ||
| .compileComponents(); | ||
| })); | ||
|
|
||
| beforeEach(() => { | ||
| fixture = TestBed.createComponent(FrontendLibComponent); | ||
| component = fixture.componentInstance; | ||
| fixture.detectChanges(); | ||
| }); | ||
|
|
||
| it('should create', () => { | ||
| expect(component).toBeTruthy(); | ||
| }); | ||
| }); |
19 changes: 19 additions & 0 deletions
19
examples/angular_bazel_architect/projects/frontend-lib/src/lib/frontend-lib.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| import { Component, OnInit } from '@angular/core'; | ||
|
|
||
| @Component({ | ||
| selector: 'lib-frontend-lib', | ||
| template: ` | ||
| <p> | ||
| frontend-lib works! | ||
| </p> | ||
| `, | ||
| styles: [] | ||
| }) | ||
| export class FrontendLibComponent implements OnInit { | ||
|
|
||
| constructor() { } | ||
|
|
||
| ngOnInit(): void { | ||
| } | ||
|
|
||
| } |
Oops, something went wrong.