Repository: BenjaminDobler/ngtron
Branch: master
Commit: ba00550fb2b7
Files: 97
Total size: 152.5 KB
Directory structure:
gitextract_19xx1qw3/
├── .editorconfig
├── .gitignore
├── .npmignore
├── .prettierrc
├── .vscode/
│ └── settings.json
├── LICENSE
├── README.md
├── package.json
├── sandbox/
│ ├── singleproject-sandbox/
│ │ ├── .browserslistrc
│ │ ├── .editorconfig
│ │ ├── .gitignore
│ │ ├── README.md
│ │ ├── angular.json
│ │ ├── e2e/
│ │ │ ├── protractor.conf.js
│ │ │ ├── src/
│ │ │ │ ├── app.e2e-spec.ts
│ │ │ │ └── app.po.ts
│ │ │ └── tsconfig.json
│ │ ├── karma.conf.js
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── app/
│ │ │ │ ├── app-routing.module.ts
│ │ │ │ ├── app.component.html
│ │ │ │ ├── app.component.scss
│ │ │ │ ├── app.component.spec.ts
│ │ │ │ ├── app.component.ts
│ │ │ │ └── app.module.ts
│ │ │ ├── assets/
│ │ │ │ └── .gitkeep
│ │ │ ├── environments/
│ │ │ │ ├── environment.prod.ts
│ │ │ │ └── environment.ts
│ │ │ ├── index.html
│ │ │ ├── main.ts
│ │ │ ├── polyfills.ts
│ │ │ ├── styles.scss
│ │ │ └── test.ts
│ │ ├── tsconfig.app.json
│ │ ├── tsconfig.json
│ │ ├── tsconfig.spec.json
│ │ └── tslint.json
│ ├── workspace/
│ │ ├── .editorconfig
│ │ ├── .gitignore
│ │ ├── README.md
│ │ ├── angular.json
│ │ ├── package.json
│ │ ├── tsconfig.json
│ │ └── tslint.json
│ └── workspace-existing/
│ ├── .editorconfig
│ ├── .gitignore
│ ├── README.md
│ ├── angular.json
│ ├── package.json
│ ├── projects/
│ │ └── app/
│ │ ├── .browserslistrc
│ │ ├── e2e/
│ │ │ ├── protractor.conf.js
│ │ │ ├── src/
│ │ │ │ ├── app.e2e-spec.ts
│ │ │ │ └── app.po.ts
│ │ │ └── tsconfig.json
│ │ ├── karma.conf.js
│ │ ├── src/
│ │ │ ├── app/
│ │ │ │ ├── app-routing.module.ts
│ │ │ │ ├── app.component.html
│ │ │ │ ├── app.component.scss
│ │ │ │ ├── app.component.spec.ts
│ │ │ │ ├── app.component.ts
│ │ │ │ └── app.module.ts
│ │ │ ├── assets/
│ │ │ │ └── .gitkeep
│ │ │ ├── environments/
│ │ │ │ ├── environment.prod.ts
│ │ │ │ └── environment.ts
│ │ │ ├── index.html
│ │ │ ├── main.ts
│ │ │ ├── polyfills.ts
│ │ │ ├── styles.scss
│ │ │ └── test.ts
│ │ ├── tsconfig.app.json
│ │ ├── tsconfig.spec.json
│ │ └── tslint.json
│ ├── tsconfig.json
│ └── tslint.json
├── src/
│ ├── builders/
│ │ ├── build/
│ │ │ ├── index.ts
│ │ │ └── schema.json
│ │ ├── builders.json
│ │ ├── package/
│ │ │ ├── index.ts
│ │ │ └── schema.json
│ │ ├── serve/
│ │ │ ├── index.ts
│ │ │ └── schema.json
│ │ └── util/
│ │ ├── dev.server/
│ │ │ └── dev.server.ts
│ │ ├── electron.ts
│ │ ├── externals.ts
│ │ └── util.ts
│ └── schematics/
│ ├── add-to-project/
│ │ ├── index.ts
│ │ └── schema.json
│ ├── application/
│ │ ├── index.ts
│ │ └── schema.json
│ ├── collection.json
│ ├── files/
│ │ ├── electron/
│ │ │ └── package.json
│ │ └── main/
│ │ ├── src/
│ │ │ └── main.ts
│ │ └── tsconfig.json
│ └── ng-add/
│ ├── index.ts
│ └── schema.json
├── tsconfig.json
└── tslint.json
================================================
FILE CONTENTS
================================================
================================================
FILE: .editorconfig
================================================
# Editor configuration, see https://editorconfig.org
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true
[*.md]
max_line_length = off
trim_trailing_whitespace = false
================================================
FILE: .gitignore
================================================
# See http://help.github.com/ignore-files/ for more about ignoring files.
# Outputs
src/**/*.js
src/**/*.js.map
src/**/*.d.ts
# compiled output
/dist
/tmp
/out-tsc
# Only exists if Bazel was run
/bazel-out
# dependencies
/node_modules
# profiling files
chrome-profiler-events.json
speed-measure-plugin.json
# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*
# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings
# System Files
.DS_Store
Thumbs.db
================================================
FILE: .npmignore
================================================
src
!dist/**/*.ts
sandbox
================================================
FILE: .prettierrc
================================================
{
"printWidth": 160,
"tabWidth": 4,
"singleQuote": true,
"trailingComma": "es5",
"endOfLine": "lf"
}
================================================
FILE: .vscode/settings.json
================================================
{
}
================================================
FILE: LICENSE
================================================
Copyright 2019 Benjamin Dobler
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
================================================
FILE: README.md
================================================
# NgTron
Angular + Electron = :heart:
Angular CLI extension based on Schematics and Builders for building angular based electron applications.
This project uses the new architect API which was introduced in Angular 8.
**So you can only use this addon starting with angular 8!**
Ngtron will setup your angular workspace with the finest electron tools available. [Electron Builder](https://github.com/electron-userland/electron-builder) is added to package your projects for mac, windows and linux.
[](https://www.npmjs.com/@richapps/ngtron)
## Introduction
An typical electron project consists of node application which is called the **main process**. This main process can create BrowserWindows which contain web pages. Those web pages are called **renderer processes** in the context of electron. Consequently an ngtron project is a combination of different types of applications. This nicely fits with the multi project support of Angular workspaces. An ngtron project can have exactly one main (node) project and n renderer projects (normal angular projects). There is one more type which is an electron project type where this all configured. This flexible architecture allows to build electron apps which include multiple angular projects. You can for example open several windows each containing a different Angular application.
## Installation
NGTron supports the ng-add schematic to setup an angular workspace. Running the schematic will install the @richapps/ngtron packages and setup further dependencies like electron-builder.
```bash
ng add @richapps/ngtron
```
## Setup
The recommended way of using ngtron is to use multiple projects for each type (main, renderer, electron) in an angular workspace. Beside that ngtron also supports root level projects which do not use multiple projects by adding the main process and electron files inside the renderer project. Here you will find an overview of the different setups.
## Creating an application as multiple projects in a workspace (recommended)
`ng new workspace --create-application=false`
`ng add @richapps/ngtron`
`ng generate @richapps/ngtron:app`
You will be prompted for a project name. Let's assue you choose my_app as the project name.
This will generate three projects in your worspace.
- **_myapp-electron_**
This projects holds the electron specific configuration and assets like icons for your electron application.
- **_myapp-main_**
This projects is a node project which will used for the main process of your application
- **_myapp-renderer_**
This is the angular project where you can define your renderer code (Note: you can add more renderer projects if you for example want to open different angular apps in different windows of your electron app).
You can now run your app with:
`ng serve myapp-electron`
And package your app with:
`ng run myapp-electron:package`
## Using an existing angular project as the renderer for an electron app
`ng add @richapps/ngtron`
`ng generate @richapps/ngtron:app --project=<my-existing-project>
## Create a root level ngtron project
`ng new <my-project>`
`ng add @richapps/ngtron`
`ng generate @richapps/ngtron:app --project=<my-project> --singleProject=true`
## Adding ngtron to an existing root level project
`ng add @richapps/ngtron`
`ng generate @richapps/ngtron:app --project=my-existing-project --singleProject=true`
### Run app while developing (with hot reloading)
```bash
ng run project:build-electron
```
Builds the app and opens it in an electron window. Uses hot reloading whenever your code changes.
### Package your app
```bash
ng run project:package-electron
```
You can customize your build settings in the angular.json.
There you will find all the settings which you can use in electron-builder.
### Serve app in the browser
`ng run project:serve-electron`
This will serve your app in the browser even if you use node or electron apis.
Example will follow.
================================================
FILE: package.json
================================================
{
"name": "@richapps/ngtron",
"version": "1.0.0-rc.8",
"description": "Easily serve and build angular based electron applications",
"author": {
"name": "Benjamin Dobler",
"email": "benz@richapps.de",
"url": "http://www.richapps.de"
},
"repository": {
"type": "git",
"url": "https://github.com/BenjaminDobler/ngtron"
},
"license": "MIT",
"scripts": {
"build": "tsc -p tsconfig.json && npm run copy:json && npm run copy:js && npm run copy:files",
"copy:json": "cpx 'src/**/*.json' ./dist",
"copy:js": "cpx 'src/**/*.js' ./dist",
"copy:files": "cpx \"./src/schematics/files/**/*\" \"./dist/schematics/files\"",
"link:schematic": "npm link && cd sandbox/singleproject-sandbox && npm link @richapps/ngtron && cd ../workspace-existing && npm link @richapps/ngtron && cd ../workspace && npm link @richapps/ngtron",
"clean": "git checkout HEAD -- sandbox && git clean -f -d sandbox",
"test-schematic-single": "cd sandbox/singleproject-sandbox && ng generate @richapps/ngtron:app --project=singleproject-sandbox --singleProject=true",
"test-schematic-workspace-existing": "cd sandbox/workspace-existing && ng generate @richapps/ngtron:app --project=app",
"test-schematic-workspace": "cd sandbox/workspace && ng generate @richapps/ngtron:app"
},
"schematics": "./dist/schematics/collection.json",
"builders": "./dist/builders/builders.json",
"dependencies": {
"@angular-devkit/core": ">=8.0.0",
"@angular-devkit/schematics": ">=8.0.0",
"@schematics/angular": ">=8.3.12",
"find-free-port": "^2.0.0",
"fs-extra": "8.1.0",
"webpack-inject-plugin": "^1.5.3",
"ws": "^7.1.2"
},
"peerDependencies": {
"@angular-devkit/build-angular": ">=0.803.12"
},
"devDependencies": {
"@angular-devkit/build-angular": ">=0.803.12",
"@angular/compiler-cli": "^9.1.9",
"@types/jasmine": "^3.3.13",
"@types/node": "~11.9.0",
"@types/webpack": "^4.39.3",
"@types/webpack-dev-server": "^3.1.6",
"codelyzer": "^5.2.2",
"cpx": "^1.5.0",
"electron-builder": "^22.6.1",
"inquirer": "^7.1.0",
"jasmine": "^3.0.0",
"quicktype": "^15.0.194",
"tslint": "~5.15.0",
"typescript": "~3.4.3"
}
}
================================================
FILE: sandbox/singleproject-sandbox/.browserslistrc
================================================
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
# For the full list of supported browsers by the Angular framework, please see:
# https://angular.io/guide/browser-support
# You can see what browsers were selected by your queries by running:
# npx browserslist
last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major versions
last 2 iOS major versions
Firefox ESR
not IE 9-10 # Angular support for IE 9-10 has been deprecated and will be removed as of Angular v11. To opt-in, remove the 'not' prefix on this line.
not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line.
================================================
FILE: sandbox/singleproject-sandbox/.editorconfig
================================================
# Editor configuration, see https://editorconfig.org
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true
[*.ts]
quote_type = single
[*.md]
max_line_length = off
trim_trailing_whitespace = false
================================================
FILE: sandbox/singleproject-sandbox/.gitignore
================================================
# See http://help.github.com/ignore-files/ for more about ignoring files.
# compiled output
/dist
/tmp
/out-tsc
# Only exists if Bazel was run
/bazel-out
# dependencies
/node_modules
# profiling files
chrome-profiler-events*.json
speed-measure-plugin*.json
# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*
# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings
# System Files
.DS_Store
Thumbs.db
================================================
FILE: sandbox/singleproject-sandbox/README.md
================================================
# SingleprojectSandbox
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.1.7.
## Development server
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
## Code scaffolding
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
## Build
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
## Running unit tests
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
## Running end-to-end tests
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
## 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).
================================================
FILE: sandbox/singleproject-sandbox/angular.json
================================================
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"singleproject-sandbox": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
"style": "scss"
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/singleproject-sandbox",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"aot": true,
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss"
],
"scripts": []
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "6kb",
"maximumError": "10kb"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "singleproject-sandbox:build"
},
"configurations": {
"production": {
"browserTarget": "singleproject-sandbox:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "singleproject-sandbox:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"tsconfig.app.json",
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "singleproject-sandbox:serve"
},
"configurations": {
"production": {
"devServerTarget": "singleproject-sandbox:serve:production"
}
}
}
}
}},
"defaultProject": "singleproject-sandbox"
}
================================================
FILE: sandbox/singleproject-sandbox/e2e/protractor.conf.js
================================================
// @ts-check
// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/lib/config.ts
const { SpecReporter, StacktraceOption } = require('jasmine-spec-reporter');
/**
* @type { import("protractor").Config }
*/
exports.config = {
allScriptsTimeout: 11000,
specs: [
'./src/**/*.e2e-spec.ts'
],
capabilities: {
browserName: 'chrome'
},
directConnect: true,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
},
onPrepare() {
require('ts-node').register({
project: require('path').join(__dirname, './tsconfig.json')
});
jasmine.getEnv().addReporter(new SpecReporter({
spec: {
displayStacktrace: StacktraceOption.PRETTY
}
}));
}
};
================================================
FILE: sandbox/singleproject-sandbox/e2e/src/app.e2e-spec.ts
================================================
import { AppPage } from './app.po';
import { browser, logging } from 'protractor';
describe('workspace-project App', () => {
let page: AppPage;
beforeEach(() => {
page = new AppPage();
});
it('should display welcome message', () => {
page.navigateTo();
expect(page.getTitleText()).toEqual('singleproject-sandbox app is running!');
});
afterEach(async () => {
// Assert that there are no errors emitted from the browser
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
expect(logs).not.toContain(jasmine.objectContaining({
level: logging.Level.SEVERE,
} as logging.Entry));
});
});
================================================
FILE: sandbox/singleproject-sandbox/e2e/src/app.po.ts
================================================
import { browser, by, element } from 'protractor';
export class AppPage {
navigateTo(): Promise<unknown> {
return browser.get(browser.baseUrl) as Promise<unknown>;
}
getTitleText(): Promise<string> {
return element(by.css('app-root .content span')).getText() as Promise<string>;
}
}
================================================
FILE: sandbox/singleproject-sandbox/e2e/tsconfig.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/e2e",
"module": "commonjs",
"target": "es2018",
"types": [
"jasmine",
"jasminewd2",
"node"
]
}
}
================================================
FILE: sandbox/singleproject-sandbox/karma.conf.js
================================================
// 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/singleproject-sandbox'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
restartOnFileChange: true
});
};
================================================
FILE: sandbox/singleproject-sandbox/package.json
================================================
{
"name": "singleproject-sandbox",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "~10.1.6",
"@angular/common": "~10.1.6",
"@angular/compiler": "~10.1.6",
"@angular/core": "~10.1.6",
"@angular/forms": "~10.1.6",
"@angular/platform-browser": "~10.1.6",
"@angular/platform-browser-dynamic": "~10.1.6",
"@angular/router": "~10.1.6",
"rxjs": "~6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.1001.7",
"@angular/cli": "~10.1.7",
"@angular/compiler-cli": "~10.1.6",
"@types/node": "^12.11.1",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~4.0.2"
}
}
================================================
FILE: sandbox/singleproject-sandbox/src/app/app-routing.module.ts
================================================
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const routes: Routes = [];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
================================================
FILE: sandbox/singleproject-sandbox/src/app/app.component.html
================================================
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<!-- * * * * * * * * * * * The content below * * * * * * * * * * * -->
<!-- * * * * * * * * * * is only a placeholder * * * * * * * * * * -->
<!-- * * * * * * * * * * and can be replaced. * * * * * * * * * * * -->
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<!-- * * * * * * * * * Delete the template below * * * * * * * * * * -->
<!-- * * * * * * * to get started with your project! * * * * * * * * -->
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<style>
:host {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 14px;
color: #333;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 8px 0;
}
p {
margin: 0;
}
.spacer {
flex: 1;
}
.toolbar {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 60px;
display: flex;
align-items: center;
background-color: #1976d2;
color: white;
font-weight: 600;
}
.toolbar img {
margin: 0 16px;
}
.toolbar #twitter-logo {
height: 40px;
margin: 0 16px;
}
.toolbar #twitter-logo:hover {
opacity: 0.8;
}
.content {
display: flex;
margin: 82px auto 32px;
padding: 0 16px;
max-width: 960px;
flex-direction: column;
align-items: center;
}
svg.material-icons {
height: 24px;
width: auto;
}
svg.material-icons:not(:last-child) {
margin-right: 8px;
}
.card svg.material-icons path {
fill: #888;
}
.card-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 16px;
}
.card {
border-radius: 4px;
border: 1px solid #eee;
background-color: #fafafa;
height: 40px;
width: 200px;
margin: 0 8px 16px;
padding: 16px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
transition: all 0.2s ease-in-out;
line-height: 24px;
}
.card-container .card:not(:last-child) {
margin-right: 0;
}
.card.card-small {
height: 16px;
width: 168px;
}
.card-container .card:not(.highlight-card) {
cursor: pointer;
}
.card-container .card:not(.highlight-card):hover {
transform: translateY(-3px);
box-shadow: 0 4px 17px rgba(0, 0, 0, 0.35);
}
.card-container .card:not(.highlight-card):hover .material-icons path {
fill: rgb(105, 103, 103);
}
.card.highlight-card {
background-color: #1976d2;
color: white;
font-weight: 600;
border: none;
width: auto;
min-width: 30%;
position: relative;
}
.card.card.highlight-card span {
margin-left: 60px;
}
svg#rocket {
width: 80px;
position: absolute;
left: -10px;
top: -24px;
}
svg#rocket-smoke {
height: calc(100vh - 95px);
position: absolute;
top: 10px;
right: 180px;
z-index: -10;
}
a,
a:visited,
a:hover {
color: #1976d2;
text-decoration: none;
}
a:hover {
color: #125699;
}
.terminal {
position: relative;
width: 80%;
max-width: 600px;
border-radius: 6px;
padding-top: 45px;
margin-top: 8px;
overflow: hidden;
background-color: rgb(15, 15, 16);
}
.terminal::before {
content: "\2022 \2022 \2022";
position: absolute;
top: 0;
left: 0;
height: 4px;
background: rgb(58, 58, 58);
color: #c2c3c4;
width: 100%;
font-size: 2rem;
line-height: 0;
padding: 14px 0;
text-indent: 4px;
}
.terminal pre {
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
color: white;
padding: 0 1rem 1rem;
margin: 0;
}
.circle-link {
height: 40px;
width: 40px;
border-radius: 40px;
margin: 8px;
background-color: white;
border: 1px solid #eeeeee;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
transition: 1s ease-out;
}
.circle-link:hover {
transform: translateY(-0.25rem);
box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2);
}
footer {
margin-top: 8px;
display: flex;
align-items: center;
line-height: 20px;
}
footer a {
display: flex;
align-items: center;
}
.github-star-badge {
color: #24292e;
display: flex;
align-items: center;
font-size: 12px;
padding: 3px 10px;
border: 1px solid rgba(27,31,35,.2);
border-radius: 3px;
background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
margin-left: 4px;
font-weight: 600;
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
}
.github-star-badge:hover {
background-image: linear-gradient(-180deg,#f0f3f6,#e6ebf1 90%);
border-color: rgba(27,31,35,.35);
background-position: -.5em;
}
.github-star-badge .material-icons {
height: 16px;
width: 16px;
margin-right: 4px;
}
svg#clouds {
position: fixed;
bottom: -160px;
left: -230px;
z-index: -10;
width: 1920px;
}
/* Responsive Styles */
@media screen and (max-width: 767px) {
.card-container > *:not(.circle-link) ,
.terminal {
width: 100%;
}
.card:not(.highlight-card) {
height: 16px;
margin: 8px 0;
}
.card.highlight-card span {
margin-left: 72px;
}
svg#rocket-smoke {
right: 120px;
transform: rotate(-5deg);
}
}
@media screen and (max-width: 575px) {
svg#rocket-smoke {
display: none;
visibility: hidden;
}
}
</style>
<!-- Toolbar -->
<div class="toolbar" role="banner">
<img
width="40"
alt="Angular Logo"
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg=="
/>
<span>Welcome</span>
<div class="spacer"></div>
<a aria-label="Angular on twitter" target="_blank" rel="noopener" href="https://twitter.com/angular" title="Twitter">
<svg id="twitter-logo" height="24" data-name="Logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400">
<rect width="400" height="400" fill="none"/>
<path d="M153.62,301.59c94.34,0,145.94-78.16,145.94-145.94,0-2.22,0-4.43-.15-6.63A104.36,104.36,0,0,0,325,122.47a102.38,102.38,0,0,1-29.46,8.07,51.47,51.47,0,0,0,22.55-28.37,102.79,102.79,0,0,1-32.57,12.45,51.34,51.34,0,0,0-87.41,46.78A145.62,145.62,0,0,1,92.4,107.81a51.33,51.33,0,0,0,15.88,68.47A50.91,50.91,0,0,1,85,169.86c0,.21,0,.43,0,.65a51.31,51.31,0,0,0,41.15,50.28,51.21,51.21,0,0,1-23.16.88,51.35,51.35,0,0,0,47.92,35.62,102.92,102.92,0,0,1-63.7,22A104.41,104.41,0,0,1,75,278.55a145.21,145.21,0,0,0,78.62,23" fill="#fff"/>
</svg>
</a>
</div>
<div class="content" role="main">
<!-- Highlight Card -->
<div class="card highlight-card card-small">
<svg id="rocket" alt="Rocket Ship" xmlns="http://www.w3.org/2000/svg" width="101.678" height="101.678" viewBox="0 0 101.678 101.678">
<g id="Group_83" data-name="Group 83" transform="translate(-141 -696)">
<circle id="Ellipse_8" data-name="Ellipse 8" cx="50.839" cy="50.839" r="50.839" transform="translate(141 696)" fill="#dd0031"/>
<g id="Group_47" data-name="Group 47" transform="translate(165.185 720.185)">
<path id="Path_33" data-name="Path 33" d="M3.4,42.615a3.084,3.084,0,0,0,3.553,3.553,21.419,21.419,0,0,0,12.215-6.107L9.511,30.4A21.419,21.419,0,0,0,3.4,42.615Z" transform="translate(0.371 3.363)" fill="#fff"/>
<path id="Path_34" data-name="Path 34" d="M53.3,3.221A3.09,3.09,0,0,0,50.081,0,48.227,48.227,0,0,0,18.322,13.437c-6-1.666-14.991-1.221-18.322,7.218A33.892,33.892,0,0,1,9.439,25.1l-.333.666a3.013,3.013,0,0,0,.555,3.553L23.985,43.641a2.9,2.9,0,0,0,3.553.555l.666-.333A33.892,33.892,0,0,1,32.647,53.3c8.55-3.664,8.884-12.326,7.218-18.322A48.227,48.227,0,0,0,53.3,3.221ZM34.424,9.772a6.439,6.439,0,1,1,9.106,9.106,6.368,6.368,0,0,1-9.106,0A6.467,6.467,0,0,1,34.424,9.772Z" transform="translate(0 0.005)" fill="#fff"/>
</g>
</g>
</svg>
<span>{{ title }} app is running!</span>
<svg id="rocket-smoke" alt="Rocket Ship Smoke" xmlns="http://www.w3.org/2000/svg" width="516.119" height="1083.632" viewBox="0 0 516.119 1083.632">
<path id="Path_40" data-name="Path 40" d="M644.6,141S143.02,215.537,147.049,870.207s342.774,201.755,342.774,201.755S404.659,847.213,388.815,762.2c-27.116-145.51-11.551-384.124,271.9-609.1C671.15,139.365,644.6,141,644.6,141Z" transform="translate(-147.025 -140.939)" fill="#f5f5f5"/>
</svg>
</div>
<!-- Resources -->
<h2>Resources</h2>
<p>Here are some links to help you get started:</p>
<div class="card-container">
<a class="card" target="_blank" rel="noopener" href="https://angular.io/tutorial">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82zM12 3L1 9l11 6 9-4.91V17h2V9L12 3z"/></svg>
<span>Learn Angular</span>
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg> </a>
<a class="card" target="_blank" rel="noopener" href="https://angular.io/cli">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z"/></svg>
<span>CLI Documentation</span>
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg>
</a>
<a class="card" target="_blank" rel="noopener" href="https://blog.angular.io/">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13.5.67s.74 2.65.74 4.8c0 2.06-1.35 3.73-3.41 3.73-2.07 0-3.63-1.67-3.63-3.73l.03-.36C5.21 7.51 4 10.62 4 14c0 4.42 3.58 8 8 8s8-3.58 8-8C20 8.61 17.41 3.8 13.5.67zM11.71 19c-1.78 0-3.22-1.4-3.22-3.14 0-1.62 1.05-2.76 2.81-3.12 1.77-.36 3.6-1.21 4.62-2.58.39 1.29.59 2.65.59 4.04 0 2.65-2.15 4.8-4.8 4.8z"/></svg>
<span>Angular Blog</span>
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg>
</a>
</div>
<!-- Next Steps -->
<h2>Next Steps</h2>
<p>What do you want to do next with your app?</p>
<input type="hidden" #selection>
<div class="card-container">
<div class="card card-small" (click)="selection.value = 'component'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>New Component</span>
</div>
<div class="card card-small" (click)="selection.value = 'material'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Angular Material</span>
</div>
<div class="card card-small" (click)="selection.value = 'pwa'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Add PWA Support</span>
</div>
<div class="card card-small" (click)="selection.value = 'dependency'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Add Dependency</span>
</div>
<div class="card card-small" (click)="selection.value = 'test'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Run and Watch Tests</span>
</div>
<div class="card card-small" (click)="selection.value = 'build'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Build for Production</span>
</div>
</div>
<!-- Terminal -->
<div class="terminal" [ngSwitch]="selection.value">
<pre *ngSwitchDefault>ng generate component xyz</pre>
<pre *ngSwitchCase="'material'">ng add @angular/material</pre>
<pre *ngSwitchCase="'pwa'">ng add @angular/pwa</pre>
<pre *ngSwitchCase="'dependency'">ng add _____</pre>
<pre *ngSwitchCase="'test'">ng test</pre>
<pre *ngSwitchCase="'build'">ng build --prod</pre>
</div>
<!-- Links -->
<div class="card-container">
<a class="circle-link" title="Animations" href="https://angular.io/guide/animations" target="_blank" rel="noopener">
<svg id="Group_20" data-name="Group 20" xmlns="http://www.w3.org/2000/svg" width="21.813" height="23.453" viewBox="0 0 21.813 23.453">
<path id="Path_15" data-name="Path 15" d="M4099.584,972.736h0l-10.882,3.9,1.637,14.4,9.245,5.153,9.245-5.153,1.686-14.4Z" transform="translate(-4088.702 -972.736)" fill="#ffa726"/>
<path id="Path_16" data-name="Path 16" d="M4181.516,972.736v23.453l9.245-5.153,1.686-14.4Z" transform="translate(-4170.633 -972.736)" fill="#fb8c00"/>
<path id="Path_17" data-name="Path 17" d="M4137.529,1076.127l-7.7-3.723,4.417-2.721,7.753,3.723Z" transform="translate(-4125.003 -1058.315)" fill="#ffe0b2"/>
<path id="Path_18" data-name="Path 18" d="M4137.529,1051.705l-7.7-3.723,4.417-2.721,7.753,3.723Z" transform="translate(-4125.003 -1036.757)" fill="#fff3e0"/>
<path id="Path_19" data-name="Path 19" d="M4137.529,1027.283l-7.7-3.723,4.417-2.721,7.753,3.723Z" transform="translate(-4125.003 -1015.199)" fill="#fff"/>
</svg>
</a>
<a class="circle-link" title="CLI" href="https://cli.angular.io/" target="_blank" rel="noopener">
<svg alt="Angular CLI Logo" xmlns="http://www.w3.org/2000/svg" width="21.762" height="23.447" viewBox="0 0 21.762 23.447">
<g id="Group_21" data-name="Group 21" transform="translate(0)">
<path id="Path_20" data-name="Path 20" d="M2660.313,313.618h0l-10.833,3.9,1.637,14.4,9.2,5.152,9.244-5.152,1.685-14.4Z" transform="translate(-2649.48 -313.618)" fill="#37474f"/>
<path id="Path_21" data-name="Path 21" d="M2741.883,313.618v23.447l9.244-5.152,1.685-14.4Z" transform="translate(-2731.05 -313.618)" fill="#263238"/>
<path id="Path_22" data-name="Path 22" d="M2692.293,379.169h11.724V368.618h-11.724Zm11.159-.6h-10.608v-9.345h10.621v9.345Z" transform="translate(-2687.274 -362.17)" fill="#fff"/>
<path id="Path_23" data-name="Path 23" d="M2709.331,393.688l.4.416,2.265-2.28-2.294-2.294-.4.4,1.893,1.893Z" transform="translate(-2702.289 -380.631)" fill="#fff"/>
<rect id="Rectangle_12" data-name="Rectangle 12" width="3.517" height="0.469" transform="translate(9.709 13.744)" fill="#fff"/>
</g>
</svg>
</a>
<a class="circle-link" title="Augury" href="https://augury.rangle.io/" target="_blank" rel="noopener">
<svg alt="Angular Augury Logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="21.81" height="23.447" viewBox="0 0 21.81 23.447">
<defs>
<clipPath id="clip-path">
<rect id="Rectangle_13" data-name="Rectangle 13" width="10.338" height="10.27" fill="none"/>
</clipPath>
</defs>
<g id="Group_25" data-name="Group 25" transform="translate(0)">
<path id="Path_24" data-name="Path 24" d="M3780.155,311.417h0l-10.881,3.9,1.637,14.4,9.244,5.152,9.244-5.152,1.685-14.4Z" transform="translate(-3769.274 -311.417)" fill="#4a3493"/>
<path id="Path_25" data-name="Path 25" d="M3862.088,311.417v23.447l9.244-5.152,1.685-14.4Z" transform="translate(-3851.207 -311.417)" fill="#311b92"/>
<g id="Group_24" data-name="Group 24" transform="translate(6.194 6.73)" opacity="0.5">
<g id="Group_23" data-name="Group 23" transform="translate(0 0)">
<g id="Group_22" data-name="Group 22" clip-path="url(#clip-path)">
<path id="Path_26" data-name="Path 26" d="M3832.4,373.252a5.168,5.168,0,1,1-5.828-4.383,5.216,5.216,0,0,1,2.574.3,3.017,3.017,0,1,0,3.252,4.086Z" transform="translate(-3822.107 -368.821)" fill="#fff"/>
</g>
</g>
</g>
<path id="Path_27" data-name="Path 27" d="M3830.582,370.848a5.162,5.162,0,1,1-3.254-4.086,3.017,3.017,0,1,0,3.252,4.086Z" transform="translate(-3814.311 -359.969)" fill="#fff"/>
</g>
</svg>
</a>
<a class="circle-link" title="Protractor" href="https://www.protractortest.org/" target="_blank" rel="noopener">
<svg alt="Angular Protractor Logo" xmlns="http://www.w3.org/2000/svg" width="21.81" height="23.447" viewBox="0 0 21.81 23.447">
<g id="Group_26" data-name="Group 26" transform="translate(0)">
<path id="Path_28" data-name="Path 28" d="M4620.155,311.417h0l-10.881,3.9,1.637,14.4,9.244,5.152,9.244-5.152,1.685-14.4Z" transform="translate(-4609.274 -311.417)" fill="#e13439"/>
<path id="Path_29" data-name="Path 29" d="M4702.088,311.417v23.447l9.244-5.152,1.685-14.4Z" transform="translate(-4691.207 -311.417)" fill="#b52f32"/>
<path id="Path_30" data-name="Path 30" d="M4651.044,369.58v-.421h1.483a7.6,7.6,0,0,0-2.106-5.052l-1.123,1.123-.3-.3,1.122-1.121a7.588,7.588,0,0,0-4.946-2.055v1.482h-.421v-1.485a7.589,7.589,0,0,0-5.051,2.058l1.122,1.121-.3.3-1.123-1.123a7.591,7.591,0,0,0-2.106,5.052h1.482v.421h-1.489v1.734h15.241V369.58Zm-10.966-.263a4.835,4.835,0,0,1,9.67,0Z" transform="translate(-4634.008 -355.852)" fill="#fff"/>
</g>
</svg>
</a>
<a class="circle-link" title="Find a Local Meetup" href="https://www.meetup.com/find/?keywords=angular" target="_blank" rel="noopener">
<svg alt="Meetup Logo" xmlns="http://www.w3.org/2000/svg" width="24.607" height="23.447" viewBox="0 0 24.607 23.447">
<path id="logo--mSwarm" d="M21.221,14.95A4.393,4.393,0,0,1,17.6,19.281a4.452,4.452,0,0,1-.8.069c-.09,0-.125.035-.154.117a2.939,2.939,0,0,1-2.506,2.091,2.868,2.868,0,0,1-2.248-.624.168.168,0,0,0-.245-.005,3.926,3.926,0,0,1-2.589.741,4.015,4.015,0,0,1-3.7-3.347,2.7,2.7,0,0,1-.043-.38c0-.106-.042-.146-.143-.166a3.524,3.524,0,0,1-1.516-.69A3.623,3.623,0,0,1,2.23,14.557a3.66,3.66,0,0,1,1.077-3.085.138.138,0,0,0,.026-.2,3.348,3.348,0,0,1-.451-1.821,3.46,3.46,0,0,1,2.749-3.28.44.44,0,0,0,.355-.281,5.072,5.072,0,0,1,3.863-3,5.028,5.028,0,0,1,3.555.666.31.31,0,0,0,.271.03A4.5,4.5,0,0,1,18.3,4.7a4.4,4.4,0,0,1,1.334,2.751,3.658,3.658,0,0,1,.022.706.131.131,0,0,0,.1.157,2.432,2.432,0,0,1,1.574,1.645,2.464,2.464,0,0,1-.7,2.616c-.065.064-.051.1-.014.166A4.321,4.321,0,0,1,21.221,14.95ZM13.4,14.607a2.09,2.09,0,0,0,1.409,1.982,4.7,4.7,0,0,0,1.275.221,1.807,1.807,0,0,0,.9-.151.542.542,0,0,0,.321-.545.558.558,0,0,0-.359-.534,1.2,1.2,0,0,0-.254-.078c-.262-.047-.526-.086-.787-.138a.674.674,0,0,1-.617-.75,3.394,3.394,0,0,1,.218-1.109c.217-.658.509-1.286.79-1.918a15.609,15.609,0,0,0,.745-1.86,1.95,1.95,0,0,0,.06-1.073,1.286,1.286,0,0,0-1.051-1.033,1.977,1.977,0,0,0-1.521.2.339.339,0,0,1-.446-.042c-.1-.092-.2-.189-.307-.284a1.214,1.214,0,0,0-1.643-.061,7.563,7.563,0,0,1-.614.512A.588.588,0,0,1,10.883,8c-.215-.115-.437-.215-.659-.316a2.153,2.153,0,0,0-.695-.248A2.091,2.091,0,0,0,7.541,8.562a9.915,9.915,0,0,0-.405.986c-.559,1.545-1.015,3.123-1.487,4.7a1.528,1.528,0,0,0,.634,1.777,1.755,1.755,0,0,0,1.5.211,1.35,1.35,0,0,0,.824-.858c.543-1.281,1.032-2.584,1.55-3.875.142-.355.28-.712.432-1.064a.548.548,0,0,1,.851-.24.622.622,0,0,1,.185.539,2.161,2.161,0,0,1-.181.621c-.337.852-.68,1.7-1.018,2.552a2.564,2.564,0,0,0-.173.528.624.624,0,0,0,.333.71,1.073,1.073,0,0,0,.814.034,1.22,1.22,0,0,0,.657-.655q.758-1.488,1.511-2.978.35-.687.709-1.37a1.073,1.073,0,0,1,.357-.434.43.43,0,0,1,.463-.016.373.373,0,0,1,.153.387.7.7,0,0,1-.057.236c-.065.157-.127.316-.2.469-.42.883-.846,1.763-1.262,2.648A2.463,2.463,0,0,0,13.4,14.607Zm5.888,6.508a1.09,1.09,0,0,0-2.179.006,1.09,1.09,0,0,0,2.179-.006ZM1.028,12.139a1.038,1.038,0,1,0,.01-2.075,1.038,1.038,0,0,0-.01,2.075ZM13.782.528a1.027,1.027,0,1,0-.011,2.055A1.027,1.027,0,0,0,13.782.528ZM22.21,6.95a.882.882,0,0,0-1.763.011A.882.882,0,0,0,22.21,6.95ZM4.153,4.439a.785.785,0,1,0,.787-.78A.766.766,0,0,0,4.153,4.439Zm8.221,18.22a.676.676,0,1,0-.677.666A.671.671,0,0,0,12.374,22.658ZM22.872,12.2a.674.674,0,0,0-.665.665.656.656,0,0,0,.655.643.634.634,0,0,0,.655-.644A.654.654,0,0,0,22.872,12.2ZM7.171-.123A.546.546,0,0,0,6.613.43a.553.553,0,1,0,1.106,0A.539.539,0,0,0,7.171-.123ZM24.119,9.234a.507.507,0,0,0-.493.488.494.494,0,0,0,.494.494.48.48,0,0,0,.487-.483A.491.491,0,0,0,24.119,9.234Zm-19.454,9.7a.5.5,0,0,0-.488-.488.491.491,0,0,0-.487.5.483.483,0,0,0,.491.479A.49.49,0,0,0,4.665,18.936Z" transform="translate(0 0.123)" fill="#f64060"/>
</svg>
</a>
<a class="circle-link" title="Join the Conversation on Gitter" href="https://gitter.im/angular/angular" target="_blank" rel="noopener">
<svg alt="Gitter Logo" xmlns="http://www.w3.org/2000/svg" width="19.447" height="19.447" viewBox="0 0 19.447 19.447">
<g id="Group_40" data-name="Group 40" transform="translate(-1612 -405)">
<rect id="Rectangle_19" data-name="Rectangle 19" width="19.447" height="19.447" transform="translate(1612 405)" fill="#e60257"/>
<g id="gitter" transform="translate(1617.795 408.636)">
<g id="Group_33" data-name="Group 33" transform="translate(0 0)">
<rect id="Rectangle_15" data-name="Rectangle 15" width="1.04" height="9.601" transform="translate(2.304 2.324)" fill="#fff"/>
<rect id="Rectangle_16" data-name="Rectangle 16" width="1.04" height="9.601" transform="translate(4.607 2.324)" fill="#fff"/>
<rect id="Rectangle_17" data-name="Rectangle 17" width="1.04" height="4.648" transform="translate(6.91 2.324)" fill="#fff"/>
<rect id="Rectangle_18" data-name="Rectangle 18" width="1.04" height="6.971" transform="translate(0 0)" fill="#fff"/>
</g>
</g>
</g>
</svg>
</a>
</div>
<!-- Footer -->
<footer>
Love Angular?
<a href="https://github.com/angular/angular" target="_blank" rel="noopener"> Give our repo a star.
<div class="github-star-badge">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>
Star
</div>
</a>
<a href="https://github.com/angular/angular" target="_blank" rel="noopener">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" fill="#1976d2"/><path d="M0 0h24v24H0z" fill="none"/></svg>
</a>
</footer>
<svg id="clouds" alt="Gray Clouds Background" xmlns="http://www.w3.org/2000/svg" width="2611.084" height="485.677" viewBox="0 0 2611.084 485.677">
<path id="Path_39" data-name="Path 39" d="M2379.709,863.793c10-93-77-171-168-149-52-114-225-105-264,15-75,3-140,59-152,133-30,2.83-66.725,9.829-93.5,26.25-26.771-16.421-63.5-23.42-93.5-26.25-12-74-77-130-152-133-39-120-212-129-264-15-54.084-13.075-106.753,9.173-138.488,48.9-31.734-39.726-84.4-61.974-138.487-48.9-52-114-225-105-264,15a162.027,162.027,0,0,0-103.147,43.044c-30.633-45.365-87.1-72.091-145.206-58.044-52-114-225-105-264,15-75,3-140,59-152,133-53,5-127,23-130,83-2,42,35,72,70,86,49,20,106,18,157,5a165.625,165.625,0,0,0,120,0c47,94,178,113,251,33,61.112,8.015,113.854-5.72,150.492-29.764a165.62,165.62,0,0,0,110.861-3.236c47,94,178,113,251,33,31.385,4.116,60.563,2.495,86.487-3.311,25.924,5.806,55.1,7.427,86.488,3.311,73,80,204,61,251-33a165.625,165.625,0,0,0,120,0c51,13,108,15,157-5a147.188,147.188,0,0,0,33.5-18.694,147.217,147.217,0,0,0,33.5,18.694c49,20,106,18,157,5a165.625,165.625,0,0,0,120,0c47,94,178,113,251,33C2446.709,1093.793,2554.709,922.793,2379.709,863.793Z" transform="translate(142.69 -634.312)" fill="#eee"/>
</svg>
</div>
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<!-- * * * * * * * * * * * The content above * * * * * * * * * * * -->
<!-- * * * * * * * * * * is only a placeholder * * * * * * * * * * -->
<!-- * * * * * * * * * * and can be replaced. * * * * * * * * * * * -->
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<!-- * * * * * * * * * * End of Placeholder * * * * * * * * * * * -->
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<router-outlet></router-outlet>
================================================
FILE: sandbox/singleproject-sandbox/src/app/app.component.scss
================================================
================================================
FILE: sandbox/singleproject-sandbox/src/app/app.component.spec.ts
================================================
import { TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AppComponent } from './app.component';
describe('AppComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [
RouterTestingModule
],
declarations: [
AppComponent
],
}).compileComponents();
});
it('should create the app', () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
expect(app).toBeTruthy();
});
it(`should have as title 'singleproject-sandbox'`, () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
expect(app.title).toEqual('singleproject-sandbox');
});
it('should render title', () => {
const fixture = TestBed.createComponent(AppComponent);
fixture.detectChanges();
const compiled = fixture.nativeElement;
expect(compiled.querySelector('.content span').textContent).toContain('singleproject-sandbox app is running!');
});
});
================================================
FILE: sandbox/singleproject-sandbox/src/app/app.component.ts
================================================
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
title = 'singleproject-sandbox';
}
================================================
FILE: sandbox/singleproject-sandbox/src/app/app.module.ts
================================================
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
================================================
FILE: sandbox/singleproject-sandbox/src/assets/.gitkeep
================================================
================================================
FILE: sandbox/singleproject-sandbox/src/environments/environment.prod.ts
================================================
export const environment = {
production: true
};
================================================
FILE: sandbox/singleproject-sandbox/src/environments/environment.ts
================================================
// This file can be replaced during build by using the `fileReplacements` array.
// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
// The list of file replacements can be found in `angular.json`.
export const environment = {
production: false
};
/*
* For easier debugging in development mode, you can import the following file
* to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
*
* This import should be commented out in production mode because it will have a negative impact
* on performance if an error is thrown.
*/
// import 'zone.js/dist/zone-error'; // Included with Angular CLI.
================================================
FILE: sandbox/singleproject-sandbox/src/index.html
================================================
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>SingleprojectSandbox</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
</html>
================================================
FILE: sandbox/singleproject-sandbox/src/main.ts
================================================
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));
================================================
FILE: sandbox/singleproject-sandbox/src/polyfills.ts
================================================
/**
* This file includes polyfills needed by Angular and is loaded before the app.
* You can add your own extra polyfills to this file.
*
* This file is divided into 2 sections:
* 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main
* file.
*
* The current setup is for so-called "evergreen" browsers; the last versions of browsers that
* automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
* Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
*
* Learn more in https://angular.io/guide/browser-support
*/
/***************************************************************************************************
* BROWSER POLYFILLS
*/
/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import 'classlist.js'; // Run `npm install --save classlist.js`.
/**
* Web Animations `@angular/platform-browser/animations`
* Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
* Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
*/
// import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/**
* By default, zone.js will patch all possible macroTask and DomEvents
* user can disable parts of macroTask/DomEvents patch by setting following flags
* because those flags need to be set before `zone.js` being loaded, and webpack
* will put import in the top of bundle, so user need to create a separate file
* in this directory (for example: zone-flags.ts), and put the following flags
* into that file, and then add the following code before importing zone.js.
* import './zone-flags';
*
* The flags allowed in zone-flags.ts are listed here.
*
* The following flags will work for all browsers.
*
* (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
* (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
* (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge
*
* (window as any).__Zone_enable_cross_context_check = true;
*
*/
/***************************************************************************************************
* Zone JS is required by default for Angular itself.
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
*/
================================================
FILE: sandbox/singleproject-sandbox/src/styles.scss
================================================
/* You can add global styles to this file, and also import other style files */
================================================
FILE: sandbox/singleproject-sandbox/src/test.ts
================================================
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/zone-testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';
declare const require: {
context(path: string, deep?: boolean, filter?: RegExp): {
keys(): string[];
<T>(id: string): T;
};
};
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting()
);
// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);
// And load the modules.
context.keys().map(context);
================================================
FILE: sandbox/singleproject-sandbox/tsconfig.app.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/app",
"types": []
},
"files": [
"src/main.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.d.ts"
]
}
================================================
FILE: sandbox/singleproject-sandbox/tsconfig.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "es2015",
"module": "es2020",
"lib": [
"es2018",
"dom"
]
}
}
================================================
FILE: sandbox/singleproject-sandbox/tsconfig.spec.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/spec",
"types": [
"jasmine"
]
},
"files": [
"src/test.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.spec.ts",
"src/**/*.d.ts"
]
}
================================================
FILE: sandbox/singleproject-sandbox/tslint.json
================================================
{
"extends": "tslint:recommended",
"rulesDirectory": [
"codelyzer"
],
"rules": {
"align": {
"options": [
"parameters",
"statements"
]
},
"array-type": false,
"arrow-return-shorthand": true,
"curly": true,
"deprecation": {
"severity": "warning"
},
"eofline": true,
"import-blacklist": [
true,
"rxjs/Rx"
],
"import-spacing": true,
"indent": {
"options": [
"spaces"
]
},
"max-classes-per-file": false,
"max-line-length": [
true,
140
],
"member-ordering": [
true,
{
"order": [
"static-field",
"instance-field",
"static-method",
"instance-method"
]
}
],
"no-console": [
true,
"debug",
"info",
"time",
"timeEnd",
"trace"
],
"no-empty": false,
"no-inferrable-types": [
true,
"ignore-params"
],
"no-non-null-assertion": true,
"no-redundant-jsdoc": true,
"no-switch-case-fall-through": true,
"no-var-requires": false,
"object-literal-key-quotes": [
true,
"as-needed"
],
"quotemark": [
true,
"single"
],
"semicolon": {
"options": [
"always"
]
},
"space-before-function-paren": {
"options": {
"anonymous": "never",
"asyncArrow": "always",
"constructor": "never",
"method": "never",
"named": "never"
}
},
"typedef": [
true,
"call-signature"
],
"typedef-whitespace": {
"options": [
{
"call-signature": "nospace",
"index-signature": "nospace",
"parameter": "nospace",
"property-declaration": "nospace",
"variable-declaration": "nospace"
},
{
"call-signature": "onespace",
"index-signature": "onespace",
"parameter": "onespace",
"property-declaration": "onespace",
"variable-declaration": "onespace"
}
]
},
"variable-name": {
"options": [
"ban-keywords",
"check-format",
"allow-pascal-case"
]
},
"whitespace": {
"options": [
"check-branch",
"check-decl",
"check-operator",
"check-separator",
"check-type",
"check-typecast"
]
},
"component-class-suffix": true,
"contextual-lifecycle": true,
"directive-class-suffix": true,
"no-conflicting-lifecycle": true,
"no-host-metadata-property": true,
"no-input-rename": true,
"no-inputs-metadata-property": true,
"no-output-native": true,
"no-output-on-prefix": true,
"no-output-rename": true,
"no-outputs-metadata-property": true,
"template-banana-in-box": true,
"template-no-negated-async": true,
"use-lifecycle-interface": true,
"use-pipe-transform-interface": true,
"directive-selector": [
true,
"attribute",
"app",
"camelCase"
],
"component-selector": [
true,
"element",
"app",
"kebab-case"
]
}
}
================================================
FILE: sandbox/workspace/.editorconfig
================================================
# Editor configuration, see https://editorconfig.org
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true
[*.ts]
quote_type = single
[*.md]
max_line_length = off
trim_trailing_whitespace = false
================================================
FILE: sandbox/workspace/.gitignore
================================================
# See http://help.github.com/ignore-files/ for more about ignoring files.
# compiled output
/dist
/tmp
/out-tsc
# Only exists if Bazel was run
/bazel-out
# dependencies
/node_modules
# profiling files
chrome-profiler-events*.json
speed-measure-plugin*.json
# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*
# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings
# System Files
.DS_Store
Thumbs.db
================================================
FILE: sandbox/workspace/README.md
================================================
# Workspace
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.1.7.
## Development server
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
## Code scaffolding
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
## Build
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
## Running unit tests
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
## Running end-to-end tests
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
## 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).
================================================
FILE: sandbox/workspace/angular.json
================================================
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {}
}
================================================
FILE: sandbox/workspace/package.json
================================================
{
"name": "workspace",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint"
},
"private": true,
"dependencies": {
"@angular/animations": "~10.1.6",
"@angular/common": "~10.1.6",
"@angular/compiler": "~10.1.6",
"@angular/core": "~10.1.6",
"@angular/forms": "~10.1.6",
"@angular/platform-browser": "~10.1.6",
"@angular/platform-browser-dynamic": "~10.1.6",
"@angular/router": "~10.1.6",
"rxjs": "~6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular/cli": "~10.1.7",
"@angular/compiler-cli": "~10.1.6",
"@types/node": "^12.11.1",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~4.0.2"
}
}
================================================
FILE: sandbox/workspace/tsconfig.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "es2015",
"module": "es2020",
"lib": [
"es2018",
"dom"
]
}
}
================================================
FILE: sandbox/workspace/tslint.json
================================================
{
"extends": "tslint:recommended",
"rulesDirectory": [
"codelyzer"
],
"rules": {
"align": {
"options": [
"parameters",
"statements"
]
},
"array-type": false,
"arrow-return-shorthand": true,
"curly": true,
"deprecation": {
"severity": "warning"
},
"eofline": true,
"import-blacklist": [
true,
"rxjs/Rx"
],
"import-spacing": true,
"indent": {
"options": [
"spaces"
]
},
"max-classes-per-file": false,
"max-line-length": [
true,
140
],
"member-ordering": [
true,
{
"order": [
"static-field",
"instance-field",
"static-method",
"instance-method"
]
}
],
"no-console": [
true,
"debug",
"info",
"time",
"timeEnd",
"trace"
],
"no-empty": false,
"no-inferrable-types": [
true,
"ignore-params"
],
"no-non-null-assertion": true,
"no-redundant-jsdoc": true,
"no-switch-case-fall-through": true,
"no-var-requires": false,
"object-literal-key-quotes": [
true,
"as-needed"
],
"quotemark": [
true,
"single"
],
"semicolon": {
"options": [
"always"
]
},
"space-before-function-paren": {
"options": {
"anonymous": "never",
"asyncArrow": "always",
"constructor": "never",
"method": "never",
"named": "never"
}
},
"typedef": [
true,
"call-signature"
],
"typedef-whitespace": {
"options": [
{
"call-signature": "nospace",
"index-signature": "nospace",
"parameter": "nospace",
"property-declaration": "nospace",
"variable-declaration": "nospace"
},
{
"call-signature": "onespace",
"index-signature": "onespace",
"parameter": "onespace",
"property-declaration": "onespace",
"variable-declaration": "onespace"
}
]
},
"variable-name": {
"options": [
"ban-keywords",
"check-format",
"allow-pascal-case"
]
},
"whitespace": {
"options": [
"check-branch",
"check-decl",
"check-operator",
"check-separator",
"check-type",
"check-typecast"
]
},
"component-class-suffix": true,
"contextual-lifecycle": true,
"directive-class-suffix": true,
"no-conflicting-lifecycle": true,
"no-host-metadata-property": true,
"no-input-rename": true,
"no-inputs-metadata-property": true,
"no-output-native": true,
"no-output-on-prefix": true,
"no-output-rename": true,
"no-outputs-metadata-property": true,
"template-banana-in-box": true,
"template-no-negated-async": true,
"use-lifecycle-interface": true,
"use-pipe-transform-interface": true
}
}
================================================
FILE: sandbox/workspace-existing/.editorconfig
================================================
# Editor configuration, see https://editorconfig.org
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true
[*.ts]
quote_type = single
[*.md]
max_line_length = off
trim_trailing_whitespace = false
================================================
FILE: sandbox/workspace-existing/.gitignore
================================================
# See http://help.github.com/ignore-files/ for more about ignoring files.
# compiled output
/dist
/tmp
/out-tsc
# Only exists if Bazel was run
/bazel-out
# dependencies
/node_modules
# profiling files
chrome-profiler-events*.json
speed-measure-plugin*.json
# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*
# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings
# System Files
.DS_Store
Thumbs.db
================================================
FILE: sandbox/workspace-existing/README.md
================================================
# WorkspaceExisting
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.1.7.
## Development server
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
## Code scaffolding
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
## Build
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
## Running unit tests
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
## Running end-to-end tests
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
## 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).
================================================
FILE: sandbox/workspace-existing/angular.json
================================================
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"app": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
"style": "scss"
}
},
"root": "projects/app",
"sourceRoot": "projects/app/src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/app",
"index": "projects/app/src/index.html",
"main": "projects/app/src/main.ts",
"polyfills": "projects/app/src/polyfills.ts",
"tsConfig": "projects/app/tsconfig.app.json",
"aot": true,
"assets": [
"projects/app/src/favicon.ico",
"projects/app/src/assets"
],
"styles": [
"projects/app/src/styles.scss"
],
"scripts": []
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "projects/app/src/environments/environment.ts",
"with": "projects/app/src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "6kb",
"maximumError": "10kb"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "app:build"
},
"configurations": {
"production": {
"browserTarget": "app:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "app:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "projects/app/src/test.ts",
"polyfills": "projects/app/src/polyfills.ts",
"tsConfig": "projects/app/tsconfig.spec.json",
"karmaConfig": "projects/app/karma.conf.js",
"assets": [
"projects/app/src/favicon.ico",
"projects/app/src/assets"
],
"styles": [
"projects/app/src/styles.scss"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"projects/app/tsconfig.app.json",
"projects/app/tsconfig.spec.json",
"projects/app/e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "projects/app/e2e/protractor.conf.js",
"devServerTarget": "app:serve"
},
"configurations": {
"production": {
"devServerTarget": "app:serve:production"
}
}
}
}
}},
"defaultProject": "app"
}
================================================
FILE: sandbox/workspace-existing/package.json
================================================
{
"name": "workspace-existing",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "~10.1.6",
"@angular/common": "~10.1.6",
"@angular/compiler": "~10.1.6",
"@angular/core": "~10.1.6",
"@angular/forms": "~10.1.6",
"@angular/platform-browser": "~10.1.6",
"@angular/platform-browser-dynamic": "~10.1.6",
"@angular/router": "~10.1.6",
"rxjs": "~6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.1001.7",
"@angular/cli": "~10.1.7",
"@angular/compiler-cli": "~10.1.6",
"@types/node": "^12.11.1",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~4.0.2"
}
}
================================================
FILE: sandbox/workspace-existing/projects/app/.browserslistrc
================================================
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
# For the full list of supported browsers by the Angular framework, please see:
# https://angular.io/guide/browser-support
# You can see what browsers were selected by your queries by running:
# npx browserslist
last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major versions
last 2 iOS major versions
Firefox ESR
not IE 9-10 # Angular support for IE 9-10 has been deprecated and will be removed as of Angular v11. To opt-in, remove the 'not' prefix on this line.
not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line.
================================================
FILE: sandbox/workspace-existing/projects/app/e2e/protractor.conf.js
================================================
// @ts-check
// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/lib/config.ts
const { SpecReporter, StacktraceOption } = require('jasmine-spec-reporter');
/**
* @type { import("protractor").Config }
*/
exports.config = {
allScriptsTimeout: 11000,
specs: [
'./src/**/*.e2e-spec.ts'
],
capabilities: {
browserName: 'chrome'
},
directConnect: true,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
},
onPrepare() {
require('ts-node').register({
project: require('path').join(__dirname, './tsconfig.json')
});
jasmine.getEnv().addReporter(new SpecReporter({
spec: {
displayStacktrace: StacktraceOption.PRETTY
}
}));
}
};
================================================
FILE: sandbox/workspace-existing/projects/app/e2e/src/app.e2e-spec.ts
================================================
import { AppPage } from './app.po';
import { browser, logging } from 'protractor';
describe('workspace-project App', () => {
let page: AppPage;
beforeEach(() => {
page = new AppPage();
});
it('should display welcome message', () => {
page.navigateTo();
expect(page.getTitleText()).toEqual('app app is running!');
});
afterEach(async () => {
// Assert that there are no errors emitted from the browser
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
expect(logs).not.toContain(jasmine.objectContaining({
level: logging.Level.SEVERE,
} as logging.Entry));
});
});
================================================
FILE: sandbox/workspace-existing/projects/app/e2e/src/app.po.ts
================================================
import { browser, by, element } from 'protractor';
export class AppPage {
navigateTo(): Promise<unknown> {
return browser.get(browser.baseUrl) as Promise<unknown>;
}
getTitleText(): Promise<string> {
return element(by.css('app-root .content span')).getText() as Promise<string>;
}
}
================================================
FILE: sandbox/workspace-existing/projects/app/e2e/tsconfig.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "../../../tsconfig.json",
"compilerOptions": {
"outDir": "../../../out-tsc/e2e",
"module": "commonjs",
"target": "es2018",
"types": [
"jasmine",
"jasminewd2",
"node"
]
}
}
================================================
FILE: sandbox/workspace-existing/projects/app/karma.conf.js
================================================
// 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/app'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
restartOnFileChange: true
});
};
================================================
FILE: sandbox/workspace-existing/projects/app/src/app/app-routing.module.ts
================================================
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const routes: Routes = [];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
================================================
FILE: sandbox/workspace-existing/projects/app/src/app/app.component.html
================================================
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<!-- * * * * * * * * * * * The content below * * * * * * * * * * * -->
<!-- * * * * * * * * * * is only a placeholder * * * * * * * * * * -->
<!-- * * * * * * * * * * and can be replaced. * * * * * * * * * * * -->
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<!-- * * * * * * * * * Delete the template below * * * * * * * * * * -->
<!-- * * * * * * * to get started with your project! * * * * * * * * -->
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<style>
:host {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 14px;
color: #333;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 8px 0;
}
p {
margin: 0;
}
.spacer {
flex: 1;
}
.toolbar {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 60px;
display: flex;
align-items: center;
background-color: #1976d2;
color: white;
font-weight: 600;
}
.toolbar img {
margin: 0 16px;
}
.toolbar #twitter-logo {
height: 40px;
margin: 0 16px;
}
.toolbar #twitter-logo:hover {
opacity: 0.8;
}
.content {
display: flex;
margin: 82px auto 32px;
padding: 0 16px;
max-width: 960px;
flex-direction: column;
align-items: center;
}
svg.material-icons {
height: 24px;
width: auto;
}
svg.material-icons:not(:last-child) {
margin-right: 8px;
}
.card svg.material-icons path {
fill: #888;
}
.card-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 16px;
}
.card {
border-radius: 4px;
border: 1px solid #eee;
background-color: #fafafa;
height: 40px;
width: 200px;
margin: 0 8px 16px;
padding: 16px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
transition: all 0.2s ease-in-out;
line-height: 24px;
}
.card-container .card:not(:last-child) {
margin-right: 0;
}
.card.card-small {
height: 16px;
width: 168px;
}
.card-container .card:not(.highlight-card) {
cursor: pointer;
}
.card-container .card:not(.highlight-card):hover {
transform: translateY(-3px);
box-shadow: 0 4px 17px rgba(0, 0, 0, 0.35);
}
.card-container .card:not(.highlight-card):hover .material-icons path {
fill: rgb(105, 103, 103);
}
.card.highlight-card {
background-color: #1976d2;
color: white;
font-weight: 600;
border: none;
width: auto;
min-width: 30%;
position: relative;
}
.card.card.highlight-card span {
margin-left: 60px;
}
svg#rocket {
width: 80px;
position: absolute;
left: -10px;
top: -24px;
}
svg#rocket-smoke {
height: calc(100vh - 95px);
position: absolute;
top: 10px;
right: 180px;
z-index: -10;
}
a,
a:visited,
a:hover {
color: #1976d2;
text-decoration: none;
}
a:hover {
color: #125699;
}
.terminal {
position: relative;
width: 80%;
max-width: 600px;
border-radius: 6px;
padding-top: 45px;
margin-top: 8px;
overflow: hidden;
background-color: rgb(15, 15, 16);
}
.terminal::before {
content: "\2022 \2022 \2022";
position: absolute;
top: 0;
left: 0;
height: 4px;
background: rgb(58, 58, 58);
color: #c2c3c4;
width: 100%;
font-size: 2rem;
line-height: 0;
padding: 14px 0;
text-indent: 4px;
}
.terminal pre {
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
color: white;
padding: 0 1rem 1rem;
margin: 0;
}
.circle-link {
height: 40px;
width: 40px;
border-radius: 40px;
margin: 8px;
background-color: white;
border: 1px solid #eeeeee;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
transition: 1s ease-out;
}
.circle-link:hover {
transform: translateY(-0.25rem);
box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2);
}
footer {
margin-top: 8px;
display: flex;
align-items: center;
line-height: 20px;
}
footer a {
display: flex;
align-items: center;
}
.github-star-badge {
color: #24292e;
display: flex;
align-items: center;
font-size: 12px;
padding: 3px 10px;
border: 1px solid rgba(27,31,35,.2);
border-radius: 3px;
background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
margin-left: 4px;
font-weight: 600;
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
}
.github-star-badge:hover {
background-image: linear-gradient(-180deg,#f0f3f6,#e6ebf1 90%);
border-color: rgba(27,31,35,.35);
background-position: -.5em;
}
.github-star-badge .material-icons {
height: 16px;
width: 16px;
margin-right: 4px;
}
svg#clouds {
position: fixed;
bottom: -160px;
left: -230px;
z-index: -10;
width: 1920px;
}
/* Responsive Styles */
@media screen and (max-width: 767px) {
.card-container > *:not(.circle-link) ,
.terminal {
width: 100%;
}
.card:not(.highlight-card) {
height: 16px;
margin: 8px 0;
}
.card.highlight-card span {
margin-left: 72px;
}
svg#rocket-smoke {
right: 120px;
transform: rotate(-5deg);
}
}
@media screen and (max-width: 575px) {
svg#rocket-smoke {
display: none;
visibility: hidden;
}
}
</style>
<!-- Toolbar -->
<div class="toolbar" role="banner">
<img
width="40"
alt="Angular Logo"
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg=="
/>
<span>Welcome</span>
<div class="spacer"></div>
<a aria-label="Angular on twitter" target="_blank" rel="noopener" href="https://twitter.com/angular" title="Twitter">
<svg id="twitter-logo" height="24" data-name="Logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400">
<rect width="400" height="400" fill="none"/>
<path d="M153.62,301.59c94.34,0,145.94-78.16,145.94-145.94,0-2.22,0-4.43-.15-6.63A104.36,104.36,0,0,0,325,122.47a102.38,102.38,0,0,1-29.46,8.07,51.47,51.47,0,0,0,22.55-28.37,102.79,102.79,0,0,1-32.57,12.45,51.34,51.34,0,0,0-87.41,46.78A145.62,145.62,0,0,1,92.4,107.81a51.33,51.33,0,0,0,15.88,68.47A50.91,50.91,0,0,1,85,169.86c0,.21,0,.43,0,.65a51.31,51.31,0,0,0,41.15,50.28,51.21,51.21,0,0,1-23.16.88,51.35,51.35,0,0,0,47.92,35.62,102.92,102.92,0,0,1-63.7,22A104.41,104.41,0,0,1,75,278.55a145.21,145.21,0,0,0,78.62,23" fill="#fff"/>
</svg>
</a>
</div>
<div class="content" role="main">
<!-- Highlight Card -->
<div class="card highlight-card card-small">
<svg id="rocket" alt="Rocket Ship" xmlns="http://www.w3.org/2000/svg" width="101.678" height="101.678" viewBox="0 0 101.678 101.678">
<g id="Group_83" data-name="Group 83" transform="translate(-141 -696)">
<circle id="Ellipse_8" data-name="Ellipse 8" cx="50.839" cy="50.839" r="50.839" transform="translate(141 696)" fill="#dd0031"/>
<g id="Group_47" data-name="Group 47" transform="translate(165.185 720.185)">
<path id="Path_33" data-name="Path 33" d="M3.4,42.615a3.084,3.084,0,0,0,3.553,3.553,21.419,21.419,0,0,0,12.215-6.107L9.511,30.4A21.419,21.419,0,0,0,3.4,42.615Z" transform="translate(0.371 3.363)" fill="#fff"/>
<path id="Path_34" data-name="Path 34" d="M53.3,3.221A3.09,3.09,0,0,0,50.081,0,48.227,48.227,0,0,0,18.322,13.437c-6-1.666-14.991-1.221-18.322,7.218A33.892,33.892,0,0,1,9.439,25.1l-.333.666a3.013,3.013,0,0,0,.555,3.553L23.985,43.641a2.9,2.9,0,0,0,3.553.555l.666-.333A33.892,33.892,0,0,1,32.647,53.3c8.55-3.664,8.884-12.326,7.218-18.322A48.227,48.227,0,0,0,53.3,3.221ZM34.424,9.772a6.439,6.439,0,1,1,9.106,9.106,6.368,6.368,0,0,1-9.106,0A6.467,6.467,0,0,1,34.424,9.772Z" transform="translate(0 0.005)" fill="#fff"/>
</g>
</g>
</svg>
<span>{{ title }} app is running!</span>
<svg id="rocket-smoke" alt="Rocket Ship Smoke" xmlns="http://www.w3.org/2000/svg" width="516.119" height="1083.632" viewBox="0 0 516.119 1083.632">
<path id="Path_40" data-name="Path 40" d="M644.6,141S143.02,215.537,147.049,870.207s342.774,201.755,342.774,201.755S404.659,847.213,388.815,762.2c-27.116-145.51-11.551-384.124,271.9-609.1C671.15,139.365,644.6,141,644.6,141Z" transform="translate(-147.025 -140.939)" fill="#f5f5f5"/>
</svg>
</div>
<!-- Resources -->
<h2>Resources</h2>
<p>Here are some links to help you get started:</p>
<div class="card-container">
<a class="card" target="_blank" rel="noopener" href="https://angular.io/tutorial">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82zM12 3L1 9l11 6 9-4.91V17h2V9L12 3z"/></svg>
<span>Learn Angular</span>
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg> </a>
<a class="card" target="_blank" rel="noopener" href="https://angular.io/cli">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z"/></svg>
<span>CLI Documentation</span>
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg>
</a>
<a class="card" target="_blank" rel="noopener" href="https://blog.angular.io/">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13.5.67s.74 2.65.74 4.8c0 2.06-1.35 3.73-3.41 3.73-2.07 0-3.63-1.67-3.63-3.73l.03-.36C5.21 7.51 4 10.62 4 14c0 4.42 3.58 8 8 8s8-3.58 8-8C20 8.61 17.41 3.8 13.5.67zM11.71 19c-1.78 0-3.22-1.4-3.22-3.14 0-1.62 1.05-2.76 2.81-3.12 1.77-.36 3.6-1.21 4.62-2.58.39 1.29.59 2.65.59 4.04 0 2.65-2.15 4.8-4.8 4.8z"/></svg>
<span>Angular Blog</span>
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg>
</a>
</div>
<!-- Next Steps -->
<h2>Next Steps</h2>
<p>What do you want to do next with your app?</p>
<input type="hidden" #selection>
<div class="card-container">
<div class="card card-small" (click)="selection.value = 'component'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>New Component</span>
</div>
<div class="card card-small" (click)="selection.value = 'material'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Angular Material</span>
</div>
<div class="card card-small" (click)="selection.value = 'pwa'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Add PWA Support</span>
</div>
<div class="card card-small" (click)="selection.value = 'dependency'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Add Dependency</span>
</div>
<div class="card card-small" (click)="selection.value = 'test'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Run and Watch Tests</span>
</div>
<div class="card card-small" (click)="selection.value = 'build'" tabindex="0">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
<span>Build for Production</span>
</div>
</div>
<!-- Terminal -->
<div class="terminal" [ngSwitch]="selection.value">
<pre *ngSwitchDefault>ng generate component xyz</pre>
<pre *ngSwitchCase="'material'">ng add @angular/material</pre>
<pre *ngSwitchCase="'pwa'">ng add @angular/pwa</pre>
<pre *ngSwitchCase="'dependency'">ng add _____</pre>
<pre *ngSwitchCase="'test'">ng test</pre>
<pre *ngSwitchCase="'build'">ng build --prod</pre>
</div>
<!-- Links -->
<div class="card-container">
<a class="circle-link" title="Animations" href="https://angular.io/guide/animations" target="_blank" rel="noopener">
<svg id="Group_20" data-name="Group 20" xmlns="http://www.w3.org/2000/svg" width="21.813" height="23.453" viewBox="0 0 21.813 23.453">
<path id="Path_15" data-name="Path 15" d="M4099.584,972.736h0l-10.882,3.9,1.637,14.4,9.245,5.153,9.245-5.153,1.686-14.4Z" transform="translate(-4088.702 -972.736)" fill="#ffa726"/>
<path id="Path_16" data-name="Path 16" d="M4181.516,972.736v23.453l9.245-5.153,1.686-14.4Z" transform="translate(-4170.633 -972.736)" fill="#fb8c00"/>
<path id="Path_17" data-name="Path 17" d="M4137.529,1076.127l-7.7-3.723,4.417-2.721,7.753,3.723Z" transform="translate(-4125.003 -1058.315)" fill="#ffe0b2"/>
<path id="Path_18" data-name="Path 18" d="M4137.529,1051.705l-7.7-3.723,4.417-2.721,7.753,3.723Z" transform="translate(-4125.003 -1036.757)" fill="#fff3e0"/>
<path id="Path_19" data-name="Path 19" d="M4137.529,1027.283l-7.7-3.723,4.417-2.721,7.753,3.723Z" transform="translate(-4125.003 -1015.199)" fill="#fff"/>
</svg>
</a>
<a class="circle-link" title="CLI" href="https://cli.angular.io/" target="_blank" rel="noopener">
<svg alt="Angular CLI Logo" xmlns="http://www.w3.org/2000/svg" width="21.762" height="23.447" viewBox="0 0 21.762 23.447">
<g id="Group_21" data-name="Group 21" transform="translate(0)">
<path id="Path_20" data-name="Path 20" d="M2660.313,313.618h0l-10.833,3.9,1.637,14.4,9.2,5.152,9.244-5.152,1.685-14.4Z" transform="translate(-2649.48 -313.618)" fill="#37474f"/>
<path id="Path_21" data-name="Path 21" d="M2741.883,313.618v23.447l9.244-5.152,1.685-14.4Z" transform="translate(-2731.05 -313.618)" fill="#263238"/>
<path id="Path_22" data-name="Path 22" d="M2692.293,379.169h11.724V368.618h-11.724Zm11.159-.6h-10.608v-9.345h10.621v9.345Z" transform="translate(-2687.274 -362.17)" fill="#fff"/>
<path id="Path_23" data-name="Path 23" d="M2709.331,393.688l.4.416,2.265-2.28-2.294-2.294-.4.4,1.893,1.893Z" transform="translate(-2702.289 -380.631)" fill="#fff"/>
<rect id="Rectangle_12" data-name="Rectangle 12" width="3.517" height="0.469" transform="translate(9.709 13.744)" fill="#fff"/>
</g>
</svg>
</a>
<a class="circle-link" title="Augury" href="https://augury.rangle.io/" target="_blank" rel="noopener">
<svg alt="Angular Augury Logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="21.81" height="23.447" viewBox="0 0 21.81 23.447">
<defs>
<clipPath id="clip-path">
<rect id="Rectangle_13" data-name="Rectangle 13" width="10.338" height="10.27" fill="none"/>
</clipPath>
</defs>
<g id="Group_25" data-name="Group 25" transform="translate(0)">
<path id="Path_24" data-name="Path 24" d="M3780.155,311.417h0l-10.881,3.9,1.637,14.4,9.244,5.152,9.244-5.152,1.685-14.4Z" transform="translate(-3769.274 -311.417)" fill="#4a3493"/>
<path id="Path_25" data-name="Path 25" d="M3862.088,311.417v23.447l9.244-5.152,1.685-14.4Z" transform="translate(-3851.207 -311.417)" fill="#311b92"/>
<g id="Group_24" data-name="Group 24" transform="translate(6.194 6.73)" opacity="0.5">
<g id="Group_23" data-name="Group 23" transform="translate(0 0)">
<g id="Group_22" data-name="Group 22" clip-path="url(#clip-path)">
<path id="Path_26" data-name="Path 26" d="M3832.4,373.252a5.168,5.168,0,1,1-5.828-4.383,5.216,5.216,0,0,1,2.574.3,3.017,3.017,0,1,0,3.252,4.086Z" transform="translate(-3822.107 -368.821)" fill="#fff"/>
</g>
</g>
</g>
<path id="Path_27" data-name="Path 27" d="M3830.582,370.848a5.162,5.162,0,1,1-3.254-4.086,3.017,3.017,0,1,0,3.252,4.086Z" transform="translate(-3814.311 -359.969)" fill="#fff"/>
</g>
</svg>
</a>
<a class="circle-link" title="Protractor" href="https://www.protractortest.org/" target="_blank" rel="noopener">
<svg alt="Angular Protractor Logo" xmlns="http://www.w3.org/2000/svg" width="21.81" height="23.447" viewBox="0 0 21.81 23.447">
<g id="Group_26" data-name="Group 26" transform="translate(0)">
<path id="Path_28" data-name="Path 28" d="M4620.155,311.417h0l-10.881,3.9,1.637,14.4,9.244,5.152,9.244-5.152,1.685-14.4Z" transform="translate(-4609.274 -311.417)" fill="#e13439"/>
<path id="Path_29" data-name="Path 29" d="M4702.088,311.417v23.447l9.244-5.152,1.685-14.4Z" transform="translate(-4691.207 -311.417)" fill="#b52f32"/>
<path id="Path_30" data-name="Path 30" d="M4651.044,369.58v-.421h1.483a7.6,7.6,0,0,0-2.106-5.052l-1.123,1.123-.3-.3,1.122-1.121a7.588,7.588,0,0,0-4.946-2.055v1.482h-.421v-1.485a7.589,7.589,0,0,0-5.051,2.058l1.122,1.121-.3.3-1.123-1.123a7.591,7.591,0,0,0-2.106,5.052h1.482v.421h-1.489v1.734h15.241V369.58Zm-10.966-.263a4.835,4.835,0,0,1,9.67,0Z" transform="translate(-4634.008 -355.852)" fill="#fff"/>
</g>
</svg>
</a>
<a class="circle-link" title="Find a Local Meetup" href="https://www.meetup.com/find/?keywords=angular" target="_blank" rel="noopener">
<svg alt="Meetup Logo" xmlns="http://www.w3.org/2000/svg" width="24.607" height="23.447" viewBox="0 0 24.607 23.447">
<path id="logo--mSwarm" d="M21.221,14.95A4.393,4.393,0,0,1,17.6,19.281a4.452,4.452,0,0,1-.8.069c-.09,0-.125.035-.154.117a2.939,2.939,0,0,1-2.506,2.091,2.868,2.868,0,0,1-2.248-.624.168.168,0,0,0-.245-.005,3.926,3.926,0,0,1-2.589.741,4.015,4.015,0,0,1-3.7-3.347,2.7,2.7,0,0,1-.043-.38c0-.106-.042-.146-.143-.166a3.524,3.524,0,0,1-1.516-.69A3.623,3.623,0,0,1,2.23,14.557a3.66,3.66,0,0,1,1.077-3.085.138.138,0,0,0,.026-.2,3.348,3.348,0,0,1-.451-1.821,3.46,3.46,0,0,1,2.749-3.28.44.44,0,0,0,.355-.281,5.072,5.072,0,0,1,3.863-3,5.028,5.028,0,0,1,3.555.666.31.31,0,0,0,.271.03A4.5,4.5,0,0,1,18.3,4.7a4.4,4.4,0,0,1,1.334,2.751,3.658,3.658,0,0,1,.022.706.131.131,0,0,0,.1.157,2.432,2.432,0,0,1,1.574,1.645,2.464,2.464,0,0,1-.7,2.616c-.065.064-.051.1-.014.166A4.321,4.321,0,0,1,21.221,14.95ZM13.4,14.607a2.09,2.09,0,0,0,1.409,1.982,4.7,4.7,0,0,0,1.275.221,1.807,1.807,0,0,0,.9-.151.542.542,0,0,0,.321-.545.558.558,0,0,0-.359-.534,1.2,1.2,0,0,0-.254-.078c-.262-.047-.526-.086-.787-.138a.674.674,0,0,1-.617-.75,3.394,3.394,0,0,1,.218-1.109c.217-.658.509-1.286.79-1.918a15.609,15.609,0,0,0,.745-1.86,1.95,1.95,0,0,0,.06-1.073,1.286,1.286,0,0,0-1.051-1.033,1.977,1.977,0,0,0-1.521.2.339.339,0,0,1-.446-.042c-.1-.092-.2-.189-.307-.284a1.214,1.214,0,0,0-1.643-.061,7.563,7.563,0,0,1-.614.512A.588.588,0,0,1,10.883,8c-.215-.115-.437-.215-.659-.316a2.153,2.153,0,0,0-.695-.248A2.091,2.091,0,0,0,7.541,8.562a9.915,9.915,0,0,0-.405.986c-.559,1.545-1.015,3.123-1.487,4.7a1.528,1.528,0,0,0,.634,1.777,1.755,1.755,0,0,0,1.5.211,1.35,1.35,0,0,0,.824-.858c.543-1.281,1.032-2.584,1.55-3.875.142-.355.28-.712.432-1.064a.548.548,0,0,1,.851-.24.622.622,0,0,1,.185.539,2.161,2.161,0,0,1-.181.621c-.337.852-.68,1.7-1.018,2.552a2.564,2.564,0,0,0-.173.528.624.624,0,0,0,.333.71,1.073,1.073,0,0,0,.814.034,1.22,1.22,0,0,0,.657-.655q.758-1.488,1.511-2.978.35-.687.709-1.37a1.073,1.073,0,0,1,.357-.434.43.43,0,0,1,.463-.016.373.373,0,0,1,.153.387.7.7,0,0,1-.057.236c-.065.157-.127.316-.2.469-.42.883-.846,1.763-1.262,2.648A2.463,2.463,0,0,0,13.4,14.607Zm5.888,6.508a1.09,1.09,0,0,0-2.179.006,1.09,1.09,0,0,0,2.179-.006ZM1.028,12.139a1.038,1.038,0,1,0,.01-2.075,1.038,1.038,0,0,0-.01,2.075ZM13.782.528a1.027,1.027,0,1,0-.011,2.055A1.027,1.027,0,0,0,13.782.528ZM22.21,6.95a.882.882,0,0,0-1.763.011A.882.882,0,0,0,22.21,6.95ZM4.153,4.439a.785.785,0,1,0,.787-.78A.766.766,0,0,0,4.153,4.439Zm8.221,18.22a.676.676,0,1,0-.677.666A.671.671,0,0,0,12.374,22.658ZM22.872,12.2a.674.674,0,0,0-.665.665.656.656,0,0,0,.655.643.634.634,0,0,0,.655-.644A.654.654,0,0,0,22.872,12.2ZM7.171-.123A.546.546,0,0,0,6.613.43a.553.553,0,1,0,1.106,0A.539.539,0,0,0,7.171-.123ZM24.119,9.234a.507.507,0,0,0-.493.488.494.494,0,0,0,.494.494.48.48,0,0,0,.487-.483A.491.491,0,0,0,24.119,9.234Zm-19.454,9.7a.5.5,0,0,0-.488-.488.491.491,0,0,0-.487.5.483.483,0,0,0,.491.479A.49.49,0,0,0,4.665,18.936Z" transform="translate(0 0.123)" fill="#f64060"/>
</svg>
</a>
<a class="circle-link" title="Join the Conversation on Gitter" href="https://gitter.im/angular/angular" target="_blank" rel="noopener">
<svg alt="Gitter Logo" xmlns="http://www.w3.org/2000/svg" width="19.447" height="19.447" viewBox="0 0 19.447 19.447">
<g id="Group_40" data-name="Group 40" transform="translate(-1612 -405)">
<rect id="Rectangle_19" data-name="Rectangle 19" width="19.447" height="19.447" transform="translate(1612 405)" fill="#e60257"/>
<g id="gitter" transform="translate(1617.795 408.636)">
<g id="Group_33" data-name="Group 33" transform="translate(0 0)">
<rect id="Rectangle_15" data-name="Rectangle 15" width="1.04" height="9.601" transform="translate(2.304 2.324)" fill="#fff"/>
<rect id="Rectangle_16" data-name="Rectangle 16" width="1.04" height="9.601" transform="translate(4.607 2.324)" fill="#fff"/>
<rect id="Rectangle_17" data-name="Rectangle 17" width="1.04" height="4.648" transform="translate(6.91 2.324)" fill="#fff"/>
<rect id="Rectangle_18" data-name="Rectangle 18" width="1.04" height="6.971" transform="translate(0 0)" fill="#fff"/>
</g>
</g>
</g>
</svg>
</a>
</div>
<!-- Footer -->
<footer>
Love Angular?
<a href="https://github.com/angular/angular" target="_blank" rel="noopener"> Give our repo a star.
<div class="github-star-badge">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>
Star
</div>
</a>
<a href="https://github.com/angular/angular" target="_blank" rel="noopener">
<svg class="material-icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" fill="#1976d2"/><path d="M0 0h24v24H0z" fill="none"/></svg>
</a>
</footer>
<svg id="clouds" alt="Gray Clouds Background" xmlns="http://www.w3.org/2000/svg" width="2611.084" height="485.677" viewBox="0 0 2611.084 485.677">
<path id="Path_39" data-name="Path 39" d="M2379.709,863.793c10-93-77-171-168-149-52-114-225-105-264,15-75,3-140,59-152,133-30,2.83-66.725,9.829-93.5,26.25-26.771-16.421-63.5-23.42-93.5-26.25-12-74-77-130-152-133-39-120-212-129-264-15-54.084-13.075-106.753,9.173-138.488,48.9-31.734-39.726-84.4-61.974-138.487-48.9-52-114-225-105-264,15a162.027,162.027,0,0,0-103.147,43.044c-30.633-45.365-87.1-72.091-145.206-58.044-52-114-225-105-264,15-75,3-140,59-152,133-53,5-127,23-130,83-2,42,35,72,70,86,49,20,106,18,157,5a165.625,165.625,0,0,0,120,0c47,94,178,113,251,33,61.112,8.015,113.854-5.72,150.492-29.764a165.62,165.62,0,0,0,110.861-3.236c47,94,178,113,251,33,31.385,4.116,60.563,2.495,86.487-3.311,25.924,5.806,55.1,7.427,86.488,3.311,73,80,204,61,251-33a165.625,165.625,0,0,0,120,0c51,13,108,15,157-5a147.188,147.188,0,0,0,33.5-18.694,147.217,147.217,0,0,0,33.5,18.694c49,20,106,18,157,5a165.625,165.625,0,0,0,120,0c47,94,178,113,251,33C2446.709,1093.793,2554.709,922.793,2379.709,863.793Z" transform="translate(142.69 -634.312)" fill="#eee"/>
</svg>
</div>
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<!-- * * * * * * * * * * * The content above * * * * * * * * * * * -->
<!-- * * * * * * * * * * is only a placeholder * * * * * * * * * * -->
<!-- * * * * * * * * * * and can be replaced. * * * * * * * * * * * -->
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<!-- * * * * * * * * * * End of Placeholder * * * * * * * * * * * -->
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
<router-outlet></router-outlet>
================================================
FILE: sandbox/workspace-existing/projects/app/src/app/app.component.scss
================================================
================================================
FILE: sandbox/workspace-existing/projects/app/src/app/app.component.spec.ts
================================================
import { TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AppComponent } from './app.component';
describe('AppComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [
RouterTestingModule
],
declarations: [
AppComponent
],
}).compileComponents();
});
it('should create the app', () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
expect(app).toBeTruthy();
});
it(`should have as title 'app'`, () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
expect(app.title).toEqual('app');
});
it('should render title', () => {
const fixture = TestBed.createComponent(AppComponent);
fixture.detectChanges();
const compiled = fixture.nativeElement;
expect(compiled.querySelector('.content span').textContent).toContain('app app is running!');
});
});
================================================
FILE: sandbox/workspace-existing/projects/app/src/app/app.component.ts
================================================
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
title = 'app';
}
================================================
FILE: sandbox/workspace-existing/projects/app/src/app/app.module.ts
================================================
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
================================================
FILE: sandbox/workspace-existing/projects/app/src/assets/.gitkeep
================================================
================================================
FILE: sandbox/workspace-existing/projects/app/src/environments/environment.prod.ts
================================================
export const environment = {
production: true
};
================================================
FILE: sandbox/workspace-existing/projects/app/src/environments/environment.ts
================================================
// This file can be replaced during build by using the `fileReplacements` array.
// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
// The list of file replacements can be found in `angular.json`.
export const environment = {
production: false
};
/*
* For easier debugging in development mode, you can import the following file
* to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
*
* This import should be commented out in production mode because it will have a negative impact
* on performance if an error is thrown.
*/
// import 'zone.js/dist/zone-error'; // Included with Angular CLI.
================================================
FILE: sandbox/workspace-existing/projects/app/src/index.html
================================================
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>App</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
</html>
================================================
FILE: sandbox/workspace-existing/projects/app/src/main.ts
================================================
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));
================================================
FILE: sandbox/workspace-existing/projects/app/src/polyfills.ts
================================================
/**
* This file includes polyfills needed by Angular and is loaded before the app.
* You can add your own extra polyfills to this file.
*
* This file is divided into 2 sections:
* 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main
* file.
*
* The current setup is for so-called "evergreen" browsers; the last versions of browsers that
* automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
* Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
*
* Learn more in https://angular.io/guide/browser-support
*/
/***************************************************************************************************
* BROWSER POLYFILLS
*/
/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import 'classlist.js'; // Run `npm install --save classlist.js`.
/**
* Web Animations `@angular/platform-browser/animations`
* Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
* Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
*/
// import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/**
* By default, zone.js will patch all possible macroTask and DomEvents
* user can disable parts of macroTask/DomEvents patch by setting following flags
* because those flags need to be set before `zone.js` being loaded, and webpack
* will put import in the top of bundle, so user need to create a separate file
* in this directory (for example: zone-flags.ts), and put the following flags
* into that file, and then add the following code before importing zone.js.
* import './zone-flags';
*
* The flags allowed in zone-flags.ts are listed here.
*
* The following flags will work for all browsers.
*
* (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
* (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
* (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge
*
* (window as any).__Zone_enable_cross_context_check = true;
*
*/
/***************************************************************************************************
* Zone JS is required by default for Angular itself.
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
*/
================================================
FILE: sandbox/workspace-existing/projects/app/src/styles.scss
================================================
/* You can add global styles to this file, and also import other style files */
================================================
FILE: sandbox/workspace-existing/projects/app/src/test.ts
================================================
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/zone-testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';
declare const require: {
context(path: string, deep?: boolean, filter?: RegExp): {
keys(): string[];
<T>(id: string): T;
};
};
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting()
);
// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);
// And load the modules.
context.keys().map(context);
================================================
FILE: sandbox/workspace-existing/projects/app/tsconfig.app.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"outDir": "../../out-tsc/app",
"types": []
},
"files": [
"src/main.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.d.ts"
]
}
================================================
FILE: sandbox/workspace-existing/projects/app/tsconfig.spec.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"outDir": "../../out-tsc/spec",
"types": [
"jasmine"
]
},
"files": [
"src/test.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.spec.ts",
"src/**/*.d.ts"
]
}
================================================
FILE: sandbox/workspace-existing/projects/app/tslint.json
================================================
{
"extends": "../../tslint.json",
"rules": {
"directive-selector": [
true,
"attribute",
"app",
"camelCase"
],
"component-selector": [
true,
"element",
"app",
"kebab-case"
]
}
}
================================================
FILE: sandbox/workspace-existing/tsconfig.json
================================================
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "es2015",
"module": "es2020",
"lib": [
"es2018",
"dom"
]
}
}
================================================
FILE: sandbox/workspace-existing/tslint.json
================================================
{
"extends": "tslint:recommended",
"rulesDirectory": [
"codelyzer"
],
"rules": {
"align": {
"options": [
"parameters",
"statements"
]
},
"array-type": false,
"arrow-return-shorthand": true,
"curly": true,
"deprecation": {
"severity": "warning"
},
"eofline": true,
"import-blacklist": [
true,
"rxjs/Rx"
],
"import-spacing": true,
"indent": {
"options": [
"spaces"
]
},
"max-classes-per-file": false,
"max-line-length": [
true,
140
],
"member-ordering": [
true,
{
"order": [
"static-field",
"instance-field",
"static-method",
"instance-method"
]
}
],
"no-console": [
true,
"debug",
"info",
"time",
"timeEnd",
"trace"
],
"no-empty": false,
"no-inferrable-types": [
true,
"ignore-params"
],
"no-non-null-assertion": true,
"no-redundant-jsdoc": true,
"no-switch-case-fall-through": true,
"no-var-requires": false,
"object-literal-key-quotes": [
true,
"as-needed"
],
"quotemark": [
true,
"single"
],
"semicolon": {
"options": [
"always"
]
},
"space-before-function-paren": {
"options": {
"anonymous": "never",
"asyncArrow": "always",
"constructor": "never",
"method": "never",
"named": "never"
}
},
"typedef": [
true,
"call-signature"
],
"typedef-whitespace": {
"options": [
{
"call-signature": "nospace",
"index-signature": "nospace",
"parameter": "nospace",
"property-declaration": "nospace",
"variable-declaration": "nospace"
},
{
"call-signature": "onespace",
"index-signature": "onespace",
"parameter": "onespace",
"property-declaration": "onespace",
"variable-declaration": "onespace"
}
]
},
"variable-name": {
"options": [
"ban-keywords",
"check-format",
"allow-pascal-case"
]
},
"whitespace": {
"options": [
"check-branch",
"check-decl",
"check-operator",
"check-separator",
"check-type",
"check-typecast"
]
},
"component-class-suffix": true,
"contextual-lifecycle": true,
"directive-class-suffix": true,
"no-conflicting-lifecycle": true,
"no-host-metadata-property": true,
"no-input-rename": true,
"no-inputs-metadata-property": true,
"no-output-native": true,
"no-output-on-prefix": true,
"no-output-rename": true,
"no-outputs-metadata-property": true,
"template-banana-in-box": true,
"template-no-negated-async": true,
"use-lifecycle-interface": true,
"use-pipe-transform-interface": true
}
}
================================================
FILE: src/builders/build/index.ts
================================================
import { BuilderContext, BuilderOutput, createBuilder, targetFromTargetString, BuilderRun } from '@angular-devkit/architect';
import { DevServerBuilderOutput } from '@angular-devkit/build-angular';
import { from, Observable, combineLatest } from 'rxjs';
import { mapTo, switchMap, tap } from 'rxjs/operators';
import { openElectron } from '../util/electron';
import { basename, join } from 'path';
import { writeFileSync, existsSync, readFileSync } from 'fs';
import { JsonObject } from '@angular-devkit/core';
import { symlinkSync, removeSync, ensureDirSync } from 'fs-extra';
import { DevServer } from '../util/dev.server/dev.server';
const InjectPlugin = require('webpack-inject-plugin').default;
import { getExternals } from '../util/externals';
import * as findFreePort from 'find-free-port';
export interface NGTronBuildOptions extends JsonObject {
mainTarget: string;
outputPath: string;
rendererOutputPath: string;
rendererTargets: string[];
watch: boolean;
serve: boolean;
package: string;
devServerPort: number;
}
export const execute = (options: NGTronBuildOptions, context: BuilderContext): Observable<BuilderOutput> => {
let devServer: DevServer;
const electronPkgPath = join(context.workspaceRoot, options.package);
const mainTarget = targetFromTargetString(options.mainTarget);
async function init() {
removeSync(join(context.workspaceRoot, options.outputPath));
ensureDirSync(join(context.workspaceRoot, options.outputPath));
const electronPkgString = readFileSync(electronPkgPath, { encoding: 'utf-8' });
const electronPkg = JSON.parse(electronPkgString);
const externals = getExternals(electronPkg.dependencies || {});
// Add the renderer targets
const builderRuns$: Observable<BuilderRun>[] = options.rendererTargets.map((target) => {
const rendererTarget = targetFromTargetString(target);
const overrides = {
outputPath: options.rendererOutputPath + '/' + rendererTarget.project,
watch: options.watch,
baseHref: './',
aot: false,
optimization: false,
webpackConfig: {
externals: externals,
},
};
return from(context.scheduleTarget(rendererTarget, overrides));
});
const mainWebpackConfig: any = {
mode: 'development',
node: {
__dirname: false,
},
externals: {
electron: 'commonjs electron',
ws: 'commonjs ws',
},
};
if (options.serve && options.watch) {
const freePorts = await findFreePort(options.devServerPort);
devServer = new DevServer(freePorts[0]);
mainWebpackConfig.plugins = [
new InjectPlugin(function () {
return devServer.getInject();
}),
];
}
// Add the node js main target
const mainOptions = await context.getTargetOptions(mainTarget);
const mainOverrides: any = {
watch: options.watch,
outputPath: options.outputPath,
webpackConfigObject: mainWebpackConfig,
};
builderRuns$.push(from(context.scheduleTarget(mainTarget, mainOverrides)));
// Symlink node modules for dev mode
if (options.serve) {
const electronBuildNodeModules = join(context.workspaceRoot, options.outputPath, 'node_modules');
if (!existsSync(electronBuildNodeModules)) {
const workspaceNodeModules = join(context.workspaceRoot, 'node_modules');
symlinkSync(workspaceNodeModules, electronBuildNodeModules, 'junction');
}
}
const result: [Observable<BuilderRun>[], JsonObject] = [builderRuns$, mainOptions];
return result;
}
let allBuildOnce = false;
return from(init()).pipe(
switchMap(([builderRuns$, mainOptions]) =>
combineLatest(builderRuns$).pipe(
switchMap((runs) =>
combineLatest(
runs.map((run) => {
if (options.serve) {
return run.output.pipe(
tap((builderOutput: BuilderOutput) => {
if (builderOutput.info.name.startsWith('@richapps/ngnode') && options.serve) {
if (allBuildOnce) {
openElectron(join(context.workspaceRoot, options.outputPath), context).subscribe();
}
} else {
if (devServer) {
devServer.sendUpdate({ type: 'renderer', info: builderOutput });
}
}
})
);
} else {
return from(run.result);
}
})
)
),
tap(() => {
if (!allBuildOnce) {
// copy electron package.json
const electronPKG = JSON.parse(readFileSync(electronPkgPath, { encoding: 'utf-8' }));
const main = (Array.isArray(mainOptions.main) ? mainOptions.main[0] : mainOptions.main) as string;
electronPKG.main = basename(main, '.ts') + '.js';
const electronPkgDistPath = join(context.workspaceRoot, options.outputPath, 'package.json');
writeFileSync(electronPkgDistPath, JSON.stringify(electronPKG, null, 4), { encoding: 'utf-8' });
openElectron(join(context.workspaceRoot, options.outputPath), context).subscribe();
allBuildOnce = true;
}
if (options.watch) {
context.reportRunning();
}
}),
mapTo({ success: true })
)
)
);
};
export default createBuilder<NGTronBuildOptions, DevServerBuilderOutput>(execute);
================================================
FILE: src/builders/build/schema.json
================================================
{
"$schema": "http://json-schema.org/schema",
"title": "Dev Server Target",
"description": "Dev Server target options for Build Facade.",
"type": "object",
"properties": {
"rendererTargets": {
"description": "One or more renderer targets for your project (angular projects)",
"type": "array",
"items": {
"type": "string",
"pattern": ".+:.+(:.+)?"
}
},
"mainTarget": {
"description": "The main process for your electron project (a node app)",
"type": "string",
"pattern": ".+:.+(:.+)?"
},
"devServerPort": {
"type": "number",
"description": "the port where the dev server listens for changes.",
"default": 6000
},
"outputPath": {
"type": "string",
"description": "Path where the electron app will be build."
},
"watch": {
"type": "boolean",
"description": ""
},
"serve": {
"type": "boolean",
"description": "",
"boolean": false
},
"rendererOutputPath": {
"type": "string",
"description": "Path where the renderer apps will be created."
},
"package": {
"type": "string",
"description": "Path to the package json for the electron app."
}
},
"additionalProperties": false,
"required": ["mainTarget", "rendererTargets"]
}
================================================
FILE: src/builders/builders.json
================================================
{
"builders": {
"build": {
"implementation": "./build",
"schema": "./build/schema.json",
"description": "build and watch electron"
},
"package": {
"implementation": "./package",
"schema": "./package/schema.json",
"description": "package electron"
},
"serve": {
"implementation": "./serve",
"schema": "./serve/schema.json",
"description": "serve electron app in the browser"
}
}
}
================================================
FILE: src/builders/package/index.ts
================================================
import { BuilderContext, BuilderOutput, createBuilder, targetFromTargetString } from "@angular-devkit/architect";
import { DevServerBuilderOptions, DevServerBuilderOutput } from "@angular-devkit/build-angular";
import { from, Observable } from "rxjs";
import { filter, mapTo, switchMap, tap } from "rxjs/operators";
import { buildElectron } from "../util/electron";
import { electronBuildWebpackConfigTransformFactory } from "../util/util";
import { buildWebpackBrowser } from "@angular-devkit/build-angular/src/browser";
import { copyFileSync, writeFileSync } from "fs";
import { basename, join } from "path";
import { JsonObject } from "@angular-devkit/core";
export interface NGTronPackageOptions extends JsonObject {
buildTarget: string;
packagerConfig: any;
}
export const execute = (options: NGTronPackageOptions, context: BuilderContext): Observable<BuilderOutput> => {
const buildTarget = targetFromTargetString(options.buildTarget);
return from(context.getTargetOptions(buildTarget)).pipe(
switchMap(options => context.scheduleTarget(buildTarget, options)),
switchMap(run => run.output),
switchMap((x: any) => buildElectron(options.packagerConfig)),
mapTo({ success: true })
);
/*
async function setup() {
const buildTarget = targetFromTargetString(options.buildTarget);
const buildOptions = await context.getTargetOptions(buildTarget);
buildOptions.watch = false;
buildOptions.baseHref = "./";
return {
buildOptions: buildOptions,
};
}
return from(setup()).pipe(
switchMap(opt => {
return buildWebpackBrowser(opt.buildOptions as any, context, {
webpackConfiguration: electronBuildWebpackConfigTransformFactory(opt.buildOptions, opt.buildElectronOptions, context)
});
}),
filter((val, index) => index < 1),
tap(result => {
// Copy electron main
const fromMain = join(context.workspaceRoot, options.electronMain as string);
const toMain = join(result.outputPath, basename(options.electronMain as string));
copyFileSync(fromMain, toMain);
// write electron package to dist
writeFileSync(join(result.outputPath, "package.json"), JSON.stringify(options.electronPackage), { encoding: "utf-8" });
}),
switchMap((x: any) => buildElectron(options.packagerConfig)),
mapTo({ success: true })
);
*/
};
export default createBuilder<NGTronPackageOptions, DevServerBuilderOutput>(execute);
================================================
FILE: src/builders/package/schema.json
================================================
{
"$schema": "http://json-schema.org/schema",
"title": "Dev Server Target",
"description": "Dev Server target options for Build Facade.",
"type": "object",
"properties": {
"buildTarget": {
"type": "string",
"description": "Target to serve.",
"pattern": ".+:.+(:.+)?"
},
"packagerConfig": {
"type": "object"
}
},
"additionalProperties": false,
"required": ["buildTarget"]
}
================================================
FILE: src/builders/serve/index.ts
================================================
import { BuilderContext, BuilderOutput, createBuilder, targetFromTargetString } from '@angular-devkit/architect';
import { DevServerBuilderOutput } from '@angular-devkit/build-angular';
import { from, Observable } from 'rxjs';
import { mapTo, switchMap, tap } from 'rxjs/operators';
import { JsonObject } from '@angular-devkit/core';
export interface NGTronServeOptions extends JsonObject {
buildTarget: string;
}
export const execute = (options: NGTronServeOptions, context: BuilderContext): Observable<BuilderOutput> => {
const buildTarget = targetFromTargetString(options.buildTarget);
return from(context.getTargetOptions(buildTarget)).pipe(
switchMap((options) => {
return context.scheduleTarget(buildTarget, {
...options,
watch: true,
serve: true,
});
}),
switchMap((run) => run.progress),
mapTo({ success: true })
);
};
export default createBuilder<NGTronServeOptions, DevServerBuilderOutput>(execute);
================================================
FILE: src/builders/serve/schema.json
================================================
{
"$schema": "http://json-schema.org/schema",
"title": "Dev Server Target",
"description": "Dev Server target options for Build Facade.",
"type": "object",
"properties": {
"buildTarget": {
"type": "string",
"description": "Target to serve.",
"pattern": ".+:.+(:.+)?"
}
},
"additionalProperties": false,
"required": ["buildTarget"]
}
================================================
FILE: src/builders/util/dev.server/dev.server.ts
================================================
import { readFileSync } from 'fs-extra';
import { join } from 'path';
const WebSocket = require('ws');
export class DevServer {
clients: any[] = [];
constructor(private port) {
this.init();
}
init() {
const wss = new WebSocket.Server({ port: this.port });
wss.on('connection', (ws) => {
this.clients.push(ws);
});
}
sendUpdate(data) {
this.clients.forEach((ws) => {
ws.send(JSON.stringify(data));
});
}
getInject() {
let inject = readFileSync(join(__dirname, 'inject.js'), { encoding: 'utf-8' });
inject = inject.replace(/\${this.port}/, this.port);
return inject;
}
}
================================================
FILE: src/builders/util/electron.ts
================================================
import { DevServerBuilderOutput } from "@angular-devkit/build-angular";
import { BuilderContext, BuilderOutput } from "@angular-devkit/architect";
import { Observable } from "rxjs";
import { ChildProcess, spawn } from "child_process";
import { isMac } from "./util";
const builder = require("electron-builder");
let electronProcess: ChildProcess;
export function openElectron(distFolder, context: BuilderContext): Observable<BuilderOutput> {
return new Observable(observer => {
const electronBin = isMac() ? "./node_modules/.bin/electron" : "node_modules/electron/dist/electron";
if (electronProcess) {
electronProcess.kill();
}
const ls: ChildProcess = spawn(electronBin, [distFolder]);
electronProcess = ls;
ls.stdout.on("data", function (data) {
context.logger.info(data.toString());
});
ls.stderr.on("data", function (data) {
context.logger.error(data.toString());
});
ls.on("exit", function (code) {
observer.next({ success: true });
observer.complete();
});
//} else {
observer.next({ success: true });
observer.complete();
//}
});
}
export function buildElectron(config): Observable<BuilderOutput> {
return new Observable(observer => {
builder.build(config).then(
() => {
observer.next({ success: true });
observer.complete();
},
e => {
console.log("Error ", e);
observer.error();
}
);
});
}
================================================
FILE: src/builders/util/externals.ts
================================================
const NODE_BUILD_IN_MODULES = [
"assert",
"async_hooks",
"buffer",
"child_process",
"cluster",
"console",
"constants",
"crypto",
"dgram",
"dns",
"domain",
"events",
"fs",
"http",
"http2",
"https",
"inspector",
"module",
"net",
"os",
"path",
"perf_hooks",
"process",
"punycode",
"querystring",
"readline",
"repl",
"stream",
"string_decoder",
"timers",
"tls",
"trace_events",
"tty",
"url",
"util",
"v8",
"vm",
"zlib"
];
export const getExternals = (pkgDependencies) => {
const externalDependencies = ['electron', ...Object.keys(pkgDependencies), ...NODE_BUILD_IN_MODULES];
let externals: any = [
(function () {
return function (context, request, callback) {
if (externalDependencies.indexOf(request) >= 0) {
if (externalDependencies.hasOwnProperty(request)) {
// const modulePath = join(rootNodeModules, request);
return callback(null, "require('" + request + "')");
}
return callback(null, "require('" + request + "')");
}
return callback();
};
})()
];
return externals;
}
================================================
FILE: src/builders/util/util.ts
================================================
import {join} from "path";
import {BuilderContext} from "@angular-devkit/architect";
export const BUILD_IN_NODE_MODULES = ["fs", "path"]; // TODO: add all build in node modules
export const BUILD_IN_ELECTRON_MODULES = ["electron", "app", "shell"]; // TODO: add all build in electron modules
export function isMac() {
return /^darwin/.test(process.platform);
}
export const noneElectronWebpackConfigTransformFactory: any = (options: any, buildElectronOptions: any, context: BuilderContext) => {
context.logger.info("Electron Browser Serve Webpack");
return webpackConfig => {
const externalDependencies = buildElectronOptions.electronPackage.dependencies;
let EXTERNALS = Object.keys(externalDependencies);
EXTERNALS = [...EXTERNALS, ...BUILD_IN_ELECTRON_MODULES, ...BUILD_IN_NODE_MODULES];
webpackConfig.externals = [
(function () {
return function (context, request, callback) {
if (EXTERNALS.indexOf(request) >= 0) {
return callback(null, "'undefined'");
}
return callback();
};
})()
];
webpackConfig.optimization.splitChunks = false; // What the F!
return webpackConfig;
};
};
export const electronServeWebpackConfigTransformFactory: any = (options: any, buildElectronOptions: any, context: BuilderContext) => {
context.logger.info("Electron Serve Webpack");
return webpackConfig => {
const externalDependencies = buildElectronOptions.electronPackage.dependencies;
const rootNodeModules = join(context.workspaceRoot, "node_modules");
let EXTERNALS = Object.keys(externalDependencies);
EXTERNALS = [...EXTERNALS, ...BUILD_IN_ELECTRON_MODULES, ...BUILD_IN_NODE_MODULES];
webpackConfig.externals = [
(function () {
return function (context, request, callback) {
console.log("Request ", request);
if (EXTERNALS.indexOf(request) >= 0) {
if (externalDependencies.hasOwnProperty(request)) {
const modulePath = join(rootNodeModules, request);
return callback(null, "require('" + modulePath + "')");
}
return callback(null, "require('" + request + "')");
}
return callback();
};
})()
];
webpackConfig.target = "electron-renderer";
return webpackConfig;
};
};
// Package
export const electronBuildWebpackConfigTransformFactory: any = (options: any, buildElectronOptions: any, context: BuilderContext) => {
return webpackConfig => {
const externalDependencies = buildElectronOptions.electronPackage.dependencies;
let EXTERNALS = Object.keys(externalDependencies);
EXTERNALS = [...EXTERNALS, ...BUILD_IN_ELECTRON_MODULES, ...BUILD_IN_NODE_MODULES];
webpackConfig.externals = [
(function () {
return function (context, request, callback) {
if (EXTERNALS.indexOf(request) >= 0) {
return callback(null, "require('" + request + "')");
}
return callback();
};
})()
];
webpackConfig.target = "electron-renderer";
webpackConfig.optimization.splitChunks = false; // What the F!
console.log(webpackConfig);
return webpackConfig;
};
};
import * as ts from "typescript";
export function compile(fileNames: string[], options: ts.CompilerOptions): void {
let program = ts.createProgram(fileNames, options);
let emitResult = program.emit();
let allDiagnostics = ts
.getPreEmitDiagnostics(program)
.concat(emitResult.diagnostics);
allDiagnostics.forEach(diagnostic => {
if (diagnostic.file) {
let {line, character} = diagnostic.file.getLineAndCharacterOfPosition(
diagnostic.start!
);
let message = ts.flattenDiagnosticMessageText(
diagnostic.messageText,
"\n"
);
console.log(
`${diagnostic.file.fileName} (${line + 1},${character + 1}): ${message}`
);
} else {
console.log(
`${ts.flattenDiagnosticMessageText(diagnostic.messageText, "\n")}`
);
}
});
let exitCode = emitResult.emitSkipped ? 1 : 0;
}
================================================
FILE: src/schematics/add-to-project/index.ts
================================================
import { Tree } from "@angular-devkit/schematics/src/tree/interface";
import { SchematicContext, chain, Rule, externalSchematic, mergeWith, apply, url, move, template } from "@angular-devkit/schematics";
import { updateWorkspace } from "@schematics/angular/utility/config";
import { getWorkspace as getWorkspace2 } from "@schematics/angular/utility/config";
import { ProjectType } from "@schematics/angular/utility/workspace-models";
import { experimental } from "@angular-devkit/core";
import { JsonParseMode, parseJson } from '@angular-devkit/core';
export interface NgGenerateOptions {
project: string;
}
export default function (options: NgGenerateOptions): Rule {
return (tree: Tree, _context: SchematicContext) => {
return chain([
addRendererProject(options),
addElectronProject(options),
updateElectronWorkspace(options),
addMainProject(options),
updateMainWorkspace(options),
updateRendererWorkspace(options),
updateRendererTSConfig(options)
])(tree, _context);
};
}
function updateElectronWorkspace(options): Rule {
return async (tree: Tree, _context: SchematicContext) => {
const workspace: any = getWorkspace2(tree);
const projectName = options.project + '-electron';
const rendererName = options.project + '-renderer';
const mainName = options.project + '-main';
workspace.projects[projectName] = {
projectType: ProjectType.Application,
root: "projects/electron",
architect: {
build: {
builder: "@richapps/ngtron:build",
options: {
rendererTargets: [rendererName + ":build"],
mainTarget: mainName + ":build",
outputPath: "dist/" + projectName,
rendererOutputPath: "dist/" + projectName + "/renderers",
package: "projects/" + projectName + "/package.json"
}
},
serve: {
builder: "@richapps/ngtron:serve",
options: {
buildTarget: projectName + ":build"
}
},
package: {
builder: "@richapps/ngtron:package",
options: {
buildTarget: projectName + ":build",
packagerConfig: {
mac: ["zip", "dmg"],
config: {
appId: "some.id",
npmRebuild: false,
asar: false,
directories: {
app: "dist/" + projectName,
output: "dist/" + projectName + "-package",
buildResources: "project/" + projectName + "/electronResources"
},
electronVersion: "4.0.0"
}
}
}
}
}
}
return updateWorkspace(workspace);
}
}
function updateMainWorkspace(options): Rule {
return async (tree: Tree, _context: SchematicContext) => {
const workspace: any = getWorkspace2(tree);
const projectName = options.project + '-main';
workspace.projects[projectName] = {
projectType: "application",
root: "projects/" + projectName,
sourceRoot: "projects/" + projectName + "/src",
prefix: "app",
architect: {
build: {
builder: "@richapps/ngnode:build",
options: {
outputPath: "dist/" + projectName,
main: "projects/" + projectName + "/src/main.ts",
tsConfig: "projects/" + projectName + "/tsconfig.json"
}
}
}
}
return updateWorkspace(workspace);
}
}
function updateRendererWorkspace(options): Rule {
return async (tree: Tree, _context: SchematicContext) => {
const workspace: any = getWorkspace2(tree);
const projectName = options.project + '-renderer';
workspace.projects[projectName].architect.build.builder = '@richapps/build-angular:browser'
return updateWorkspace(workspace);
}
}
function updateRendererTSConfig(options): Rule {
return async (tree: Tree, _context: SchematicContext) => {
const config: any = getTSAppConfig(tree, options.project);
config.compilerOptions.target = 'es5';
return updateTSAppConfig(config, options.project);
}
}
export function updateTSAppConfig(config: any, project): Rule {
return (host: Tree, context: SchematicContext) => {
host.overwrite(getTSAppConfigPath(host, project), JSON.stringify(config, null, 2));
};
}
export function getTSAppConfigPath(host: Tree, project): string {
const possibleFiles = ['/projects/' + project + '-renderer/tsconfig.app.json'];
const path = possibleFiles.filter(path => host.exists(path))[0];
return path;
}
export function getTSAppConfig(host: Tree, project: string): any {
const path = getTSAppConfigPath(host, project);
const configBuffer = host.read(path);
if (configBuffer === null) {
throw new Error(`Could not find (${path})`);
}
const content = configBuffer.toString();
return parseJson(content, JsonParseMode.Loose) as {} as any;
}
export const addElectronProject = (options) => {
return addElectronFiles('projects/' + options.project + '-electron');
}
export const addMainProject = (options) => {
return addMainFiles('projects/' + options.project + '-main', options.project + '-renderer');
}
export const addRendererProject = (options: NgGenerateOptions) => {
return externalSchematic('@schematics/angular', 'application', { name: options.project + '-renderer' });
}
function addElectronFiles(dest) {
return (host: Tree, context: SchematicContext) => {
// const project = getProject(host, options.project);
return mergeWith(
apply(url(`../files/electron`), [
template({
tmpl: ''
}),
move(dest)
]));
}
}
function addMainFiles(dest, renderer) {
return (host: Tree, context: SchematicContext) => {
// const project = getProject(host, options.project);
return mergeWith(
apply(url(`../files/main`), [
template({
renderer,
tmpl: ''
}),
move(dest)
]));
}
}
================================================
FILE: src/schematics/add-to-project/schema.json
================================================
{
"$schema": "http://json-schema.org/schema",
"id": "ngtron-generate",
"title": "NGTron application schematic",
"type": "object",
"properties": {
"project": {
"type": "string",
"description": "The name of the project.",
"x-prompt": "What name should your project have?"
}
},
"required": [],
"additionalProperties": false
}
================================================
FILE: src/schematics/application/index.ts
================================================
import { Tree } from '@angular-devkit/schematics/src/tree/interface';
import { SchematicContext, chain, Rule, externalSchematic, mergeWith, apply, url, move, template, noop } from '@angular-devkit/schematics';
import { updateWorkspace } from '@schematics/angular/utility/config';
import { getWorkspace as getWorkspace2 } from '@schematics/angular/utility/config';
import { ProjectType } from '@schematics/angular/utility/workspace-models';
import { JsonParseMode, parseJson } from '@angular-devkit/core';
import * as inquirer from 'inquirer';
import { Observable } from 'rxjs';
export interface NgGenerateOptions {
project: string;
singleProject: boolean;
monoRepo: boolean;
rendererRoot: string;
rendererPrefix: string;
mainPrefix: string;
electronPrefix: string;
projectRoot: string;
name: string;
electronName: string;
mainName: string;
rendererName: string;
createRenderer: boolean;
}
async function setup(tree, options, context: SchematicContext) {
if (!options.name && !options.project) {
const result = await inquirer.prompt<{ analytics: boolean }>([
{
name: 'project',
message: `What name should your project have?`,
},
]);
options.project = result.project;
}
if (options.name && !options.project) {
options.project = options.name;
}
const workspace: any = getWorkspace2(tree);
options.projectRoot = workspace.newProjectRoot || 'projects';
const rendererProjectExists = workspace.projects.hasOwnProperty(options.project);
let isMonoRepo = true;
if (rendererProjectExists) {
isMonoRepo = workspace.projects[options.project].sourceRoot !== 'src';
options.rendererRoot = workspace.projects[options.project].root;
} else {
options.rendererRoot = options.singleProject
? options.projectRoot + '/' + options.project
: options.projectRoot + '/' + options.project + options.rendererPrefix;
}
options.monoRepo = isMonoRepo;
options.electronName = options.singleProject ? options.project : options.project + options.electronPrefix;
options.rendererName = options.singleProject ? options.project : options.project + options.rendererPrefix;
options.mainName = options.singleProject ? options.project : options.project + options.mainPrefix;
if (rendererProjectExists) {
options.rendererName = options.project;
}
options.createRenderer = !rendererProjectExists;
}
function setupRule(options: any): Rule {
return (host: Tree, context: SchematicContext) => {
const observer = new Observable<Tree>((observer) => {
setup(host, options, context).then(() => {
observer.next(host);
observer.complete();
});
});
return observer;
};
}
export default function (options: NgGenerateOptions): Rule {
return (tree: Tree, context: SchematicContext) => {
const rules = [
setupRule(options),
addRendererProject(options),
addElectronProject(options),
updateElectronWorkspace(options),
addMainProject(options),
updateMainWorkspace(options),
updateRendererWorkspace(options),
updateRendererTSConfig(options),
];
return chain(rules)(tree, context);
};
}
function updateElectronWorkspace(options): Rule {
return (tree: Tree, context: SchematicContext) => {
context.logger.info('⚙️ updateElectronWorkspace');
const workspace: any = getWorkspace2(tree);
let architectBuildName = options.singleProject ? 'build-electron' : 'build';
let architectServeName = options.singleProject ? 'serve-electron' : 'serve';
let architectPackageName = options.singleProject ? 'package-electron' : 'package';
let mainBuildTarget = options.singleProject ? options.project + ':build-node' : options.mainName + ':build';
let packagePath = options.singleProject
? options.rendererRoot + '/electron/package.json'
: options.projectRoot + '/' + options.electronName + '/package.json';
let buildResourcesPath = options.singleProject
? options.rendererRoot + '/electron/electronResources'
: options.projectRoot + '/' + options.electronName + '/electronResources';
if (!options.singleProject) {
workspace.projects[options.electronName] = {
projectType: ProjectType.Application,
root: options.projectRoot + '/electron',
architect: {},
};
}
const architect = workspace.projects[options.electronName].architect;
architect[architectBuildName] = {
builder: '@richapps/ngtron:build',
options: {
rendererTargets: [options.rendererName + ':build'],
mainTarget: mainBuildTarget,
outputPath: 'dist/' + options.electronName,
rendererOutputPath: 'dist/' + options.electronName + '/renderers',
package: packagePath,
},
};
architect[architectServeName] = {
builder: '@richapps/ngtron:serve',
options: {
buildTarget: options.electronName + ':' + architectBuildName,
},
};
architect[architectPackageName] = {
builder: '@richapps/ngtron:package',
options: {
buildTarget: options.electronName + ':' + architectBuildName,
packagerConfig: {
mac: ['zip', 'dmg'],
config: {
appId: 'some.id',
npmRebuild: false,
asar: false,
directories: {
app: 'dist/' + options.electronName,
output: 'dist/' + options.electronName + '-package',
buildResources: buildResourcesPath,
},
electronVersion: '4.0.0',
},
},
},
};
return updateWorkspace(workspace);
};
}
function updateMainWorkspace(options): Rule {
return (tree: Tree, context: SchematicContext) => {
context.logger.info('⚙️ updateMainWorkspace');
const workspace: any = getWorkspace2(tree);
const architectBuildName = options.singleProject ? 'build-node' : 'build';
const mainTsPath = options.singleProject
? options.rendererRoot + '/electron/src/main.ts'
: options.projectRoot + '/' + options.mainName + '/src/main.ts';
const mainTsConfigPath = options.singleProject
? options.rendererRoot + '/electron/tsconfig.json'
: options.projectRoot + '/' + options.mainName + '/tsconfig.json';
if (!options.singleProject) {
workspace.projects[options.mainName] = {
projectType: 'application',
root: options.projectRoot + '/' + options.mainName,
sourceRoot: options.projectRoot + '/' + options.mainName + '/src',
architect: {},
};
}
const architect = workspace.projects[options.mainName].architect;
architect[architectBuildName] = {
builder: '@richapps/ngnode:build',
options: {
outputPath: 'dist/' + options.mainName,
main: mainTsPath,
tsConfig: mainTsConfigPath,
},
};
return updateWorkspace(workspace);
};
}
function updateRendererWorkspace(options): Rule {
return (tree: Tree, context: SchematicContext) => {
context.logger.info('⚙️ updateRendererWorkspace');
const workspace: any = getWorkspace2(tree);
workspace.projects[options.rendererName].architect.build.builder = '@richapps/build-angular:browser';
return updateWorkspace(workspace);
};
}
function updateRendererTSConfig(options): Rule {
return (tree: Tree, context: SchematicContext) => {
context.logger.info('️️⚙️ updateRendererTSConfig');
const tsConfigRoot = options.monoRepo ? options.rendererRoot : '';
const config: any = getTSAppConfig(tree, tsConfigRoot);
config.compilerOptions.target = 'es5';
if (!options.isMonoRepo) {
config.exclude = config.exclude ? [...config.exclude, 'src/electron/**/*'] : (config.exclude = ['src/electron/**/*']);
}
return updateTSAppConfig(config, tsConfigRoot);
};
}
export function updateTSAppConfig(config: any, rendererRoot): Rule {
return (host: Tree) => {
host.overwrite(getTSAppConfigPath(host, rendererRoot), JSON.stringify(config, null, 2));
};
}
export function getTSAppConfigPath(host: Tree, rendererRoot): string {
const possibleFiles = [rendererRoot + '/tsconfig.app.json'];
const path = possibleFiles.filter((path) => host.exists(path))[0];
return path;
}
export function getTSAppConfig(host: Tree, project: string): any {
const path = getTSAppConfigPath(host, project);
const configBuffer = host.read(path);
if (configBuffer === null) {
throw new Error(`Could not find (${path})`);
}
const content = configBuffer.toString();
return (parseJson(content, JsonParseMode.Loose) as {}) as any;
}
export const addElectronProject = (options) => {
return (host: Tree, context: SchematicContext) => {
context.logger.info('⚙️ addElectronProject');
const dir = options.singleProject ? options.rendererRoot + '/electron' : options.projectRoot + '/' + options.project + options.electronPrefix;
return addElectronFiles(dir);
};
};
export const addMainProject = (options) => {
return (host: Tree, context: SchematicContext) => {
context.logger.info('⚙️ addMainProject');
const dir = options.singleProject ? options.rendererRoot + '/electron' : options.projectRoot + '/' + options.project + options.mainPrefix;
return addMainFiles(dir, options.rendererName);
};
};
export const addRendererProject = (options: NgGenerateOptions) => {
return (host: Tree, context: SchematicContext) => {
if (options.createRenderer) {
context.logger.info('⚙️ addRendererProject');
return externalSchematic('@schematics/angular', 'application', {
name: options.rendererName,
});
}
};
};
function addElectronFiles(dest) {
return () => {
// const project = getProject(host, options.project);
return mergeWith(
apply(url(`../files/electron`), [
template({
tmpl: '',
}),
move(dest),
])
);
};
}
function addMainFiles(dest, renderer) {
return () => {
// const project = getProject(host, options.project);
return mergeWith(
apply(url(`../files/main`), [
template({
renderer,
tmpl: '',
}),
move(dest),
])
);
};
}
================================================
FILE: src/schematics/application/schema.json
================================================
{
"$schema": "http://json-schema.org/schema",
"id": "ngtron-generate",
"title": "NGTron application schematic",
"type": "object",
"properties": {
"singleProject": {
"type": "boolean",
"default": false
},
"rendererPrefix": {
"type": "string",
"default": "-renderer"
},
"mainPrefix": {
"type": "string",
"default": "-main"
},
"electronPrefix": {
"type": "string",
"default": "-electron"
},
"name": {
"description": "the base name of the project",
"type": "string"
},
"project": {
"description": "the name of the angular renderer project which where electron should be added to",
"type": "string"
}
},
"required": [],
"additionalProperties": false
}
================================================
FILE: src/schematics/collection.json
================================================
{
"$schema": "../../node_modules/@angular-devkit/schematics/collection-schema.json",
"schematics": {
"ng-add": {
"description": "Adds NGTron to the application without affecting any templates",
"factory": "./ng-add/index",
"schema": "./ng-add/schema.json",
"aliases": ["install"]
},
"application": {
"description": "Adds NGTron to the application without affecting any templates",
"factory": "./application/index",
"schema": "./application/schema.json",
"aliases": ["app"]
}
}
}
================================================
FILE: src/schematics/files/electron/package.json
================================================
{
"version": "0.0.0",
"name": "myapp",
"main": "",
"dependencies": {}
}
================================================
FILE: src/schematics/files/main/src/main.ts
================================================
import { join } from 'path';
import { format } from 'url';
import { app, BrowserWindow } from 'electron';
function createWindow(path: string) {
const url = format({
pathname: path,
protocol: 'file:',
slashes: true
});
let win: BrowserWindow = new BrowserWindow({ width: 800, height: 700, webPreferences: { nodeIntegration: true } });
win.loadURL(url);
win.on('closed', () => {
win = null;
});
return win;
}
app.on('ready', () => {
createWindow(join(__dirname, 'renderers', '<%= renderer %>', 'index.html'));
});
app.on('window-all-closed', () => {
app.quit();
});
================================================
FILE: src/schematics/files/main/tsconfig.json
================================================
{
"compilerOptions": {
"types": ["node"]
},
"include": ["**/*.ts"]
}
================================================
FILE: src/schematics/ng-add/index.ts
================================================
import {
addPackageJsonDependency,
NodeDependency,
NodeDependencyType,
} from '@schematics/angular/utility/dependencies'
import { NodePackageInstallTask } from '@angular-devkit/schematics/tasks'
import {
chain,
Rule,
SchematicContext,
Tree,
} from '@angular-devkit/schematics'
export interface NgAddOptions {
project: string
}
export default function (): Rule {
return (tree: Tree, _context: SchematicContext) => {
return chain([
addPackageJsonDependencies(),
installPackageJsonDependencies(),
])(tree, _context)
}
}
function addPackageJsonDependencies(): Rule {
return (host: Tree, context: SchematicContext) => {
// TODO: Get latest electron dependency or let user choose
const dependencies: NodeDependency[] = [
{
type: NodeDependencyType.Dev,
version: 'latest',
name: 'electron',
},
{
type: NodeDependencyType.Dev,
version: 'latest',
name: 'electron-builder',
},
{
type: NodeDependencyType.Dev,
version: '~12.7.12',
name: '@types/node',
},
{
type: NodeDependencyType.Dev,
version: 'latest',
name: '@richapps/ngnode',
},
{
type: NodeDependencyType.Dev,
version: 'latest',
name: '@richapps/build-angular',
},
{
type: NodeDependencyType.Dev,
version: '^6.2.0',
name: 'ts-loader',
},
]
dependencies.forEach((dependency) => {
addPackageJsonDependency(host, dependency)
context.logger.log(
'info',
`✅️ Added "${dependency.name}" into ${dependency.type}`
)
})
return host
}
}
function installPackageJsonDependencies(): Rule {
return (host: Tree, context: SchematicContext) => {
context.addTask(new NodePackageInstallTask())
context.logger.log('info', `🔍 Installing packages...`)
return host
}
}
================================================
FILE: src/schematics/ng-add/schema.json
================================================
{
"$schema": "http://json-schema.org/schema",
"id": "ngtron-ng-add",
"title": "NGTron ng-add schematic",
"type": "object",
"properties": {
"project": {
"type": "string",
"description": "The name of the project.",
"$default": {
"$source": "projectName"
}
}
},
"required": [],
"additionalProperties": false
}
================================================
FILE: tsconfig.json
================================================
{
"compilerOptions": {
"baseUrl": "tsconfig",
"lib": ["es2018", "dom"],
"declaration": true,
"module": "commonjs",
"moduleResolution": "node",
"noEmitOnError": true,
"noFallthroughCasesInSwitch": true,
"noImplicitAny": false,
"noImplicitThis": true,
"noUnusedParameters": false,
"noUnusedLocals": false,
"skipDefaultLibCheck": true,
"skipLibCheck": true,
"sourceMap": true,
"strictNullChecks": false,
"target": "es6",
"types": ["jasmine", "node"],
"outDir": "dist"
},
"include": ["src/**/*"],
"exclude": ["src/schematics/files/**/*"]
}
================================================
FILE: tslint.json
================================================
{
"extends": "tslint:recommended",
"rulesDirectory": [
"codelyzer"
],
"rules": {
"array-type": false,
"arrow-parens": false,
"deprecation": {
"severity": "warn"
},
"import-blacklist": [
true,
"rxjs/Rx"
],
"interface-name": false,
"max-classes-per-file": false,
"max-line-length": [
true,
140
],
"member-access": false,
"member-ordering": [
true,
{
"order": [
"static-field",
"instance-field",
"static-method",
"instance-method"
]
}
],
"no-consecutive-blank-lines": false,
"no-console": [
true,
"debug",
"info",
"time",
"timeEnd",
"trace"
],
"no-empty": false,
"no-inferrable-types": [
true,
"ignore-params"
],
"no-non-null-assertion": true,
"no-redundant-jsdoc": true,
"no-switch-case-fall-through": true,
"no-use-before-declare": true,
"no-var-requires": false,
"object-literal-key-quotes": [
true,
"as-needed"
],
"object-literal-sort-keys": false,
"ordered-imports": false,
"quotemark": [
true,
"single"
],
"trailing-comma": false,
"component-class-suffix": true,
"contextual-lifecycle": true,
"directive-class-suffix": true,
"no-conflicting-lifecycle": true,
"no-host-metadata-property": true,
"no-input-rename": true,
"no-inputs-metadata-property": true,
"no-output-native": true,
"no-output-on-prefix": true,
"no-output-rename": true,
"no-outputs-metadata-property": true,
"template-banana-in-box": true,
"template-no-negated-async": true,
"use-lifecycle-interface": true,
"use-pipe-transform-interface": true
}
}
gitextract_19xx1qw3/ ├── .editorconfig ├── .gitignore ├── .npmignore ├── .prettierrc ├── .vscode/ │ └── settings.json ├── LICENSE ├── README.md ├── package.json ├── sandbox/ │ ├── singleproject-sandbox/ │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── README.md │ │ ├── angular.json │ │ ├── e2e/ │ │ │ ├── protractor.conf.js │ │ │ ├── src/ │ │ │ │ ├── app.e2e-spec.ts │ │ │ │ └── app.po.ts │ │ │ └── tsconfig.json │ │ ├── karma.conf.js │ │ ├── package.json │ │ ├── src/ │ │ │ ├── app/ │ │ │ │ ├── app-routing.module.ts │ │ │ │ ├── app.component.html │ │ │ │ ├── app.component.scss │ │ │ │ ├── app.component.spec.ts │ │ │ │ ├── app.component.ts │ │ │ │ └── app.module.ts │ │ │ ├── assets/ │ │ │ │ └── .gitkeep │ │ │ ├── environments/ │ │ │ │ ├── environment.prod.ts │ │ │ │ └── environment.ts │ │ │ ├── index.html │ │ │ ├── main.ts │ │ │ ├── polyfills.ts │ │ │ ├── styles.scss │ │ │ └── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ ├── workspace/ │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── README.md │ │ ├── angular.json │ │ ├── package.json │ │ ├── tsconfig.json │ │ └── tslint.json │ └── workspace-existing/ │ ├── .editorconfig │ ├── .gitignore │ ├── README.md │ ├── angular.json │ ├── package.json │ ├── projects/ │ │ └── app/ │ │ ├── .browserslistrc │ │ ├── e2e/ │ │ │ ├── protractor.conf.js │ │ │ ├── src/ │ │ │ │ ├── app.e2e-spec.ts │ │ │ │ └── app.po.ts │ │ │ └── tsconfig.json │ │ ├── karma.conf.js │ │ ├── src/ │ │ │ ├── app/ │ │ │ │ ├── app-routing.module.ts │ │ │ │ ├── app.component.html │ │ │ │ ├── app.component.scss │ │ │ │ ├── app.component.spec.ts │ │ │ │ ├── app.component.ts │ │ │ │ └── app.module.ts │ │ │ ├── assets/ │ │ │ │ └── .gitkeep │ │ │ ├── environments/ │ │ │ │ ├── environment.prod.ts │ │ │ │ └── environment.ts │ │ │ ├── index.html │ │ │ ├── main.ts │ │ │ ├── polyfills.ts │ │ │ ├── styles.scss │ │ │ └── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ ├── tsconfig.json │ └── tslint.json ├── src/ │ ├── builders/ │ │ ├── build/ │ │ │ ├── index.ts │ │ │ └── schema.json │ │ ├── builders.json │ │ ├── package/ │ │ │ ├── index.ts │ │ │ └── schema.json │ │ ├── serve/ │ │ │ ├── index.ts │ │ │ └── schema.json │ │ └── util/ │ │ ├── dev.server/ │ │ │ └── dev.server.ts │ │ ├── electron.ts │ │ ├── externals.ts │ │ └── util.ts │ └── schematics/ │ ├── add-to-project/ │ │ ├── index.ts │ │ └── schema.json │ ├── application/ │ │ ├── index.ts │ │ └── schema.json │ ├── collection.json │ ├── files/ │ │ ├── electron/ │ │ │ └── package.json │ │ └── main/ │ │ ├── src/ │ │ │ └── main.ts │ │ └── tsconfig.json │ └── ng-add/ │ ├── index.ts │ └── schema.json ├── tsconfig.json └── tslint.json
SYMBOL INDEX (56 symbols across 21 files)
FILE: sandbox/singleproject-sandbox/e2e/protractor.conf.js
method onPrepare (line 26) | onPrepare() {
FILE: sandbox/singleproject-sandbox/e2e/src/app.po.ts
class AppPage (line 3) | class AppPage {
method navigateTo (line 4) | navigateTo(): Promise<unknown> {
method getTitleText (line 8) | getTitleText(): Promise<string> {
FILE: sandbox/singleproject-sandbox/src/app/app-routing.module.ts
class AppRoutingModule (line 10) | class AppRoutingModule { }
FILE: sandbox/singleproject-sandbox/src/app/app.component.ts
class AppComponent (line 8) | class AppComponent {
FILE: sandbox/singleproject-sandbox/src/app/app.module.ts
class AppModule (line 18) | class AppModule { }
FILE: sandbox/workspace-existing/projects/app/e2e/protractor.conf.js
method onPrepare (line 26) | onPrepare() {
FILE: sandbox/workspace-existing/projects/app/e2e/src/app.po.ts
class AppPage (line 3) | class AppPage {
method navigateTo (line 4) | navigateTo(): Promise<unknown> {
method getTitleText (line 8) | getTitleText(): Promise<string> {
FILE: sandbox/workspace-existing/projects/app/src/app/app-routing.module.ts
class AppRoutingModule (line 10) | class AppRoutingModule { }
FILE: sandbox/workspace-existing/projects/app/src/app/app.component.ts
class AppComponent (line 8) | class AppComponent {
FILE: sandbox/workspace-existing/projects/app/src/app/app.module.ts
class AppModule (line 18) | class AppModule { }
FILE: src/builders/build/index.ts
type NGTronBuildOptions (line 15) | interface NGTronBuildOptions extends JsonObject {
function init (line 31) | async function init() {
FILE: src/builders/package/index.ts
type NGTronPackageOptions (line 13) | interface NGTronPackageOptions extends JsonObject {
FILE: src/builders/serve/index.ts
type NGTronServeOptions (line 7) | interface NGTronServeOptions extends JsonObject {
FILE: src/builders/util/dev.server/dev.server.ts
class DevServer (line 6) | class DevServer {
method constructor (line 9) | constructor(private port) {
method init (line 13) | init() {
method sendUpdate (line 20) | sendUpdate(data) {
method getInject (line 26) | getInject() {
FILE: src/builders/util/electron.ts
function openElectron (line 11) | function openElectron(distFolder, context: BuilderContext): Observable<B...
function buildElectron (line 39) | function buildElectron(config): Observable<BuilderOutput> {
FILE: src/builders/util/externals.ts
constant NODE_BUILD_IN_MODULES (line 1) | const NODE_BUILD_IN_MODULES = [
FILE: src/builders/util/util.ts
constant BUILD_IN_NODE_MODULES (line 4) | const BUILD_IN_NODE_MODULES = ["fs", "path"];
constant BUILD_IN_ELECTRON_MODULES (line 5) | const BUILD_IN_ELECTRON_MODULES = ["electron", "app", "shell"];
function isMac (line 7) | function isMac() {
function compile (line 93) | function compile(fileNames: string[], options: ts.CompilerOptions): void {
FILE: src/schematics/add-to-project/index.ts
type NgGenerateOptions (line 10) | interface NgGenerateOptions {
function updateElectronWorkspace (line 29) | function updateElectronWorkspace(options): Rule {
function updateMainWorkspace (line 82) | function updateMainWorkspace(options): Rule {
function updateRendererWorkspace (line 106) | function updateRendererWorkspace(options): Rule {
function updateRendererTSConfig (line 116) | function updateRendererTSConfig(options): Rule {
function updateTSAppConfig (line 125) | function updateTSAppConfig(config: any, project): Rule {
function getTSAppConfigPath (line 131) | function getTSAppConfigPath(host: Tree, project): string {
function getTSAppConfig (line 138) | function getTSAppConfig(host: Tree, project: string): any {
function addElectronFiles (line 162) | function addElectronFiles(dest) {
function addMainFiles (line 175) | function addMainFiles(dest, renderer) {
FILE: src/schematics/application/index.ts
type NgGenerateOptions (line 10) | interface NgGenerateOptions {
function setup (line 26) | async function setup(tree, options, context: SchematicContext) {
function setupRule (line 65) | function setupRule(options: any): Rule {
function updateElectronWorkspace (line 93) | function updateElectronWorkspace(options): Rule {
function updateMainWorkspace (line 164) | function updateMainWorkspace(options): Rule {
function updateRendererWorkspace (line 198) | function updateRendererWorkspace(options): Rule {
function updateRendererTSConfig (line 207) | function updateRendererTSConfig(options): Rule {
function updateTSAppConfig (line 220) | function updateTSAppConfig(config: any, rendererRoot): Rule {
function getTSAppConfigPath (line 226) | function getTSAppConfigPath(host: Tree, rendererRoot): string {
function getTSAppConfig (line 232) | function getTSAppConfig(host: Tree, project: string): any {
function addElectronFiles (line 269) | function addElectronFiles(dest) {
function addMainFiles (line 283) | function addMainFiles(dest, renderer) {
FILE: src/schematics/files/main/src/main.ts
function createWindow (line 6) | function createWindow(path: string) {
FILE: src/schematics/ng-add/index.ts
type NgAddOptions (line 15) | interface NgAddOptions {
function addPackageJsonDependencies (line 28) | function addPackageJsonDependencies(): Rule {
function installPackageJsonDependencies (line 76) | function installPackageJsonDependencies(): Rule {
Condensed preview — 97 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (173K chars).
[
{
"path": ".editorconfig",
"chars": 246,
"preview": "# Editor configuration, see https://editorconfig.org\nroot = true\n\n[*]\ncharset = utf-8\nindent_style = space\nindent_size ="
},
{
"path": ".gitignore",
"chars": 682,
"preview": "# See http://help.github.com/ignore-files/ for more about ignoring files.\n\n# Outputs\nsrc/**/*.js\nsrc/**/*.js.map\nsrc/**/"
},
{
"path": ".npmignore",
"chars": 26,
"preview": "src\n!dist/**/*.ts\nsandbox\n"
},
{
"path": ".prettierrc",
"chars": 121,
"preview": "{\n \"printWidth\": 160,\n \"tabWidth\": 4,\n \"singleQuote\": true,\n \"trailingComma\": \"es5\",\n \"endOfLine\": \"lf\"\n}"
},
{
"path": ".vscode/settings.json",
"chars": 3,
"preview": "{\n}"
},
{
"path": "LICENSE",
"chars": 1055,
"preview": "Copyright 2019 Benjamin Dobler\n\nPermission is hereby granted, free of charge, to any person obtaining a copy of this sof"
},
{
"path": "README.md",
"chars": 4050,
"preview": "# NgTron\n\n![Alt text](ngtron.png?raw=true \"NGTron Logo\")\n\nAngular + Electron = :heart:\n\nAngular CLI extension based on S"
},
{
"path": "package.json",
"chars": 2408,
"preview": "{\n \"name\": \"@richapps/ngtron\",\n \"version\": \"1.0.0-rc.8\",\n \"description\": \"Easily serve and build angular based "
},
{
"path": "sandbox/singleproject-sandbox/.browserslistrc",
"chars": 853,
"preview": "# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.\n# For addit"
},
{
"path": "sandbox/singleproject-sandbox/.editorconfig",
"chars": 274,
"preview": "# Editor configuration, see https://editorconfig.org\nroot = true\n\n[*]\ncharset = utf-8\nindent_style = space\nindent_size ="
},
{
"path": "sandbox/singleproject-sandbox/.gitignore",
"chars": 631,
"preview": "# See http://help.github.com/ignore-files/ for more about ignoring files.\n\n# compiled output\n/dist\n/tmp\n/out-tsc\n# Only "
},
{
"path": "sandbox/singleproject-sandbox/README.md",
"chars": 1038,
"preview": "# SingleprojectSandbox\n\nThis project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10"
},
{
"path": "sandbox/singleproject-sandbox/angular.json",
"chars": 3774,
"preview": "{\n \"$schema\": \"./node_modules/@angular/cli/lib/config/schema.json\",\n \"version\": 1,\n \"newProjectRoot\": \"projects\",\n \""
},
{
"path": "sandbox/singleproject-sandbox/e2e/protractor.conf.js",
"chars": 869,
"preview": "// @ts-check\n// Protractor configuration file, see link for more information\n// https://github.com/angular/protractor/bl"
},
{
"path": "sandbox/singleproject-sandbox/e2e/src/app.e2e-spec.ts",
"chars": 654,
"preview": "import { AppPage } from './app.po';\nimport { browser, logging } from 'protractor';\n\ndescribe('workspace-project App', ()"
},
{
"path": "sandbox/singleproject-sandbox/e2e/src/app.po.ts",
"chars": 301,
"preview": "import { browser, by, element } from 'protractor';\n\nexport class AppPage {\n navigateTo(): Promise<unknown> {\n return"
},
{
"path": "sandbox/singleproject-sandbox/e2e/tsconfig.json",
"chars": 294,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"extends\": \"../tsconfig.json\",\n \"compi"
},
{
"path": "sandbox/singleproject-sandbox/karma.conf.js",
"chars": 1033,
"preview": "// Karma configuration file, see link for more information\n// https://karma-runner.github.io/1.0/config/configuration-fi"
},
{
"path": "sandbox/singleproject-sandbox/package.json",
"chars": 1264,
"preview": "{\n \"name\": \"singleproject-sandbox\",\n \"version\": \"0.0.0\",\n \"scripts\": {\n \"ng\": \"ng\",\n \"start\": \"ng serve\",\n \""
},
{
"path": "sandbox/singleproject-sandbox/src/app/app-routing.module.ts",
"chars": 245,
"preview": "import { NgModule } from '@angular/core';\nimport { Routes, RouterModule } from '@angular/router';\n\nconst routes: Routes "
},
{
"path": "sandbox/singleproject-sandbox/src/app/app.component.html",
"chars": 25757,
"preview": "<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->\n<!-- * * * * * * * * * * * The content below * * "
},
{
"path": "sandbox/singleproject-sandbox/src/app/app.component.scss",
"chars": 0,
"preview": ""
},
{
"path": "sandbox/singleproject-sandbox/src/app/app.component.spec.ts",
"chars": 1102,
"preview": "import { TestBed } from '@angular/core/testing';\nimport { RouterTestingModule } from '@angular/router/testing';\nimport {"
},
{
"path": "sandbox/singleproject-sandbox/src/app/app.component.ts",
"chars": 226,
"preview": "import { Component } from '@angular/core';\n\n@Component({\n selector: 'app-root',\n templateUrl: './app.component.html',\n"
},
{
"path": "sandbox/singleproject-sandbox/src/app/app.module.ts",
"chars": 393,
"preview": "import { BrowserModule } from '@angular/platform-browser';\nimport { NgModule } from '@angular/core';\n\nimport { AppRoutin"
},
{
"path": "sandbox/singleproject-sandbox/src/assets/.gitkeep",
"chars": 0,
"preview": ""
},
{
"path": "sandbox/singleproject-sandbox/src/environments/environment.prod.ts",
"chars": 51,
"preview": "export const environment = {\n production: true\n};\n"
},
{
"path": "sandbox/singleproject-sandbox/src/environments/environment.ts",
"chars": 662,
"preview": "// This file can be replaced during build by using the `fileReplacements` array.\n// `ng build --prod` replaces `environm"
},
{
"path": "sandbox/singleproject-sandbox/src/index.html",
"chars": 306,
"preview": "<!doctype html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <title>SingleprojectSandbox</title>\n <base href=\"/\">"
},
{
"path": "sandbox/singleproject-sandbox/src/main.ts",
"chars": 372,
"preview": "import { enableProdMode } from '@angular/core';\nimport { platformBrowserDynamic } from '@angular/platform-browser-dynami"
},
{
"path": "sandbox/singleproject-sandbox/src/polyfills.ts",
"chars": 2835,
"preview": "/**\n * This file includes polyfills needed by Angular and is loaded before the app.\n * You can add your own extra polyfi"
},
{
"path": "sandbox/singleproject-sandbox/src/styles.scss",
"chars": 80,
"preview": "/* You can add global styles to this file, and also import other style files */\n"
},
{
"path": "sandbox/singleproject-sandbox/src/test.ts",
"chars": 753,
"preview": "// This file is required by karma.conf.js and loads recursively all the .spec and framework files\n\nimport 'zone.js/dist/"
},
{
"path": "sandbox/singleproject-sandbox/tsconfig.app.json",
"chars": 287,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"extends\": \"./tsconfig.json\",\n \"compil"
},
{
"path": "sandbox/singleproject-sandbox/tsconfig.json",
"chars": 458,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"compileOnSave\": false,\n \"compilerOpti"
},
{
"path": "sandbox/singleproject-sandbox/tsconfig.spec.json",
"chars": 333,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"extends\": \"./tsconfig.json\",\n \"compil"
},
{
"path": "sandbox/singleproject-sandbox/tslint.json",
"chars": 3185,
"preview": "{\n \"extends\": \"tslint:recommended\",\n \"rulesDirectory\": [\n \"codelyzer\"\n ],\n \"rules\": {\n \"align\": {\n \"optio"
},
{
"path": "sandbox/workspace/.editorconfig",
"chars": 274,
"preview": "# Editor configuration, see https://editorconfig.org\nroot = true\n\n[*]\ncharset = utf-8\nindent_style = space\nindent_size ="
},
{
"path": "sandbox/workspace/.gitignore",
"chars": 631,
"preview": "# See http://help.github.com/ignore-files/ for more about ignoring files.\n\n# compiled output\n/dist\n/tmp\n/out-tsc\n# Only "
},
{
"path": "sandbox/workspace/README.md",
"chars": 1027,
"preview": "# Workspace\n\nThis project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.1.7.\n\n## D"
},
{
"path": "sandbox/workspace/angular.json",
"chars": 136,
"preview": "{\n \"$schema\": \"./node_modules/@angular/cli/lib/config/schema.json\",\n \"version\": 1,\n \"newProjectRoot\": \"projects\",\n \""
},
{
"path": "sandbox/workspace/package.json",
"chars": 1181,
"preview": "{\n \"name\": \"workspace\",\n \"version\": \"0.0.0\",\n \"scripts\": {\n \"ng\": \"ng\",\n \"start\": \"ng serve\",\n \"build\": \"ng "
},
{
"path": "sandbox/workspace/tsconfig.json",
"chars": 458,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"compileOnSave\": false,\n \"compilerOpti"
},
{
"path": "sandbox/workspace/tslint.json",
"chars": 2992,
"preview": "{\n \"extends\": \"tslint:recommended\",\n \"rulesDirectory\": [\n \"codelyzer\"\n ],\n \"rules\": {\n \"align\": {\n \"optio"
},
{
"path": "sandbox/workspace-existing/.editorconfig",
"chars": 274,
"preview": "# Editor configuration, see https://editorconfig.org\nroot = true\n\n[*]\ncharset = utf-8\nindent_style = space\nindent_size ="
},
{
"path": "sandbox/workspace-existing/.gitignore",
"chars": 631,
"preview": "# See http://help.github.com/ignore-files/ for more about ignoring files.\n\n# compiled output\n/dist\n/tmp\n/out-tsc\n# Only "
},
{
"path": "sandbox/workspace-existing/README.md",
"chars": 1035,
"preview": "# WorkspaceExisting\n\nThis project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.1."
},
{
"path": "sandbox/workspace-existing/angular.json",
"chars": 3915,
"preview": "{\n \"$schema\": \"./node_modules/@angular/cli/lib/config/schema.json\",\n \"version\": 1,\n \"newProjectRoot\": \"projects\",\n \""
},
{
"path": "sandbox/workspace-existing/package.json",
"chars": 1261,
"preview": "{\n \"name\": \"workspace-existing\",\n \"version\": \"0.0.0\",\n \"scripts\": {\n \"ng\": \"ng\",\n \"start\": \"ng serve\",\n \"bui"
},
{
"path": "sandbox/workspace-existing/projects/app/.browserslistrc",
"chars": 853,
"preview": "# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.\n# For addit"
},
{
"path": "sandbox/workspace-existing/projects/app/e2e/protractor.conf.js",
"chars": 869,
"preview": "// @ts-check\n// Protractor configuration file, see link for more information\n// https://github.com/angular/protractor/bl"
},
{
"path": "sandbox/workspace-existing/projects/app/e2e/src/app.e2e-spec.ts",
"chars": 636,
"preview": "import { AppPage } from './app.po';\nimport { browser, logging } from 'protractor';\n\ndescribe('workspace-project App', ()"
},
{
"path": "sandbox/workspace-existing/projects/app/e2e/src/app.po.ts",
"chars": 301,
"preview": "import { browser, by, element } from 'protractor';\n\nexport class AppPage {\n navigateTo(): Promise<unknown> {\n return"
},
{
"path": "sandbox/workspace-existing/projects/app/e2e/tsconfig.json",
"chars": 306,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"extends\": \"../../../tsconfig.json\",\n "
},
{
"path": "sandbox/workspace-existing/projects/app/karma.conf.js",
"chars": 1019,
"preview": "// Karma configuration file, see link for more information\n// https://karma-runner.github.io/1.0/config/configuration-fi"
},
{
"path": "sandbox/workspace-existing/projects/app/src/app/app-routing.module.ts",
"chars": 245,
"preview": "import { NgModule } from '@angular/core';\nimport { Routes, RouterModule } from '@angular/router';\n\nconst routes: Routes "
},
{
"path": "sandbox/workspace-existing/projects/app/src/app/app.component.html",
"chars": 25757,
"preview": "<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->\n<!-- * * * * * * * * * * * The content below * * "
},
{
"path": "sandbox/workspace-existing/projects/app/src/app/app.component.scss",
"chars": 0,
"preview": ""
},
{
"path": "sandbox/workspace-existing/projects/app/src/app/app.component.spec.ts",
"chars": 1048,
"preview": "import { TestBed } from '@angular/core/testing';\nimport { RouterTestingModule } from '@angular/router/testing';\nimport {"
},
{
"path": "sandbox/workspace-existing/projects/app/src/app/app.component.ts",
"chars": 208,
"preview": "import { Component } from '@angular/core';\n\n@Component({\n selector: 'app-root',\n templateUrl: './app.component.html',\n"
},
{
"path": "sandbox/workspace-existing/projects/app/src/app/app.module.ts",
"chars": 393,
"preview": "import { BrowserModule } from '@angular/platform-browser';\nimport { NgModule } from '@angular/core';\n\nimport { AppRoutin"
},
{
"path": "sandbox/workspace-existing/projects/app/src/assets/.gitkeep",
"chars": 0,
"preview": ""
},
{
"path": "sandbox/workspace-existing/projects/app/src/environments/environment.prod.ts",
"chars": 51,
"preview": "export const environment = {\n production: true\n};\n"
},
{
"path": "sandbox/workspace-existing/projects/app/src/environments/environment.ts",
"chars": 662,
"preview": "// This file can be replaced during build by using the `fileReplacements` array.\n// `ng build --prod` replaces `environm"
},
{
"path": "sandbox/workspace-existing/projects/app/src/index.html",
"chars": 289,
"preview": "<!doctype html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <title>App</title>\n <base href=\"/\">\n <meta name=\"vi"
},
{
"path": "sandbox/workspace-existing/projects/app/src/main.ts",
"chars": 372,
"preview": "import { enableProdMode } from '@angular/core';\nimport { platformBrowserDynamic } from '@angular/platform-browser-dynami"
},
{
"path": "sandbox/workspace-existing/projects/app/src/polyfills.ts",
"chars": 2835,
"preview": "/**\n * This file includes polyfills needed by Angular and is loaded before the app.\n * You can add your own extra polyfi"
},
{
"path": "sandbox/workspace-existing/projects/app/src/styles.scss",
"chars": 80,
"preview": "/* You can add global styles to this file, and also import other style files */\n"
},
{
"path": "sandbox/workspace-existing/projects/app/src/test.ts",
"chars": 753,
"preview": "// This file is required by karma.conf.js and loads recursively all the .spec and framework files\n\nimport 'zone.js/dist/"
},
{
"path": "sandbox/workspace-existing/projects/app/tsconfig.app.json",
"chars": 295,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"extends\": \"../../tsconfig.json\",\n \"co"
},
{
"path": "sandbox/workspace-existing/projects/app/tsconfig.spec.json",
"chars": 341,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"extends\": \"../../tsconfig.json\",\n \"co"
},
{
"path": "sandbox/workspace-existing/projects/app/tslint.json",
"chars": 247,
"preview": "{\n \"extends\": \"../../tslint.json\",\n \"rules\": {\n \"directive-selector\": [\n true,\n \"attribute\",\n \"app\","
},
{
"path": "sandbox/workspace-existing/tsconfig.json",
"chars": 458,
"preview": "/* To learn more about this file see: https://angular.io/config/tsconfig. */\n{\n \"compileOnSave\": false,\n \"compilerOpti"
},
{
"path": "sandbox/workspace-existing/tslint.json",
"chars": 2992,
"preview": "{\n \"extends\": \"tslint:recommended\",\n \"rulesDirectory\": [\n \"codelyzer\"\n ],\n \"rules\": {\n \"align\": {\n \"optio"
},
{
"path": "src/builders/build/index.ts",
"chars": 6485,
"preview": "import { BuilderContext, BuilderOutput, createBuilder, targetFromTargetString, BuilderRun } from '@angular-devkit/archit"
},
{
"path": "src/builders/build/schema.json",
"chars": 1339,
"preview": "{\n \"$schema\": \"http://json-schema.org/schema\",\n \"title\": \"Dev Server Target\",\n \"description\": \"Dev Server target opti"
},
{
"path": "src/builders/builders.json",
"chars": 462,
"preview": "{\n \"builders\": {\n \"build\": {\n \"implementation\": \"./build\",\n \"schema\": \"./build/schema.json\",\n \"descri"
},
{
"path": "src/builders/package/index.ts",
"chars": 2392,
"preview": "import { BuilderContext, BuilderOutput, createBuilder, targetFromTargetString } from \"@angular-devkit/architect\";\nimport"
},
{
"path": "src/builders/package/schema.json",
"chars": 429,
"preview": "{\n \"$schema\": \"http://json-schema.org/schema\",\n \"title\": \"Dev Server Target\",\n \"description\": \"Dev Server target opti"
},
{
"path": "src/builders/serve/index.ts",
"chars": 1033,
"preview": "import { BuilderContext, BuilderOutput, createBuilder, targetFromTargetString } from '@angular-devkit/architect';\nimport"
},
{
"path": "src/builders/serve/schema.json",
"chars": 375,
"preview": "{\n \"$schema\": \"http://json-schema.org/schema\",\n \"title\": \"Dev Server Target\",\n \"description\": \"Dev Server target opti"
},
{
"path": "src/builders/util/dev.server/dev.server.ts",
"chars": 707,
"preview": "import { readFileSync } from 'fs-extra';\nimport { join } from 'path';\n\nconst WebSocket = require('ws');\n\nexport class De"
},
{
"path": "src/builders/util/electron.ts",
"chars": 1468,
"preview": "import { DevServerBuilderOutput } from \"@angular-devkit/build-angular\";\nimport { BuilderContext, BuilderOutput } from \"@"
},
{
"path": "src/builders/util/externals.ts",
"chars": 1157,
"preview": "const NODE_BUILD_IN_MODULES = [\n \"assert\",\n \"async_hooks\",\n \"buffer\",\n \"child_process\",\n \"cluster\",\n \"console\",\n "
},
{
"path": "src/builders/util/util.ts",
"chars": 4101,
"preview": "import {join} from \"path\";\nimport {BuilderContext} from \"@angular-devkit/architect\";\n\nexport const BUILD_IN_NODE_MODULES"
},
{
"path": "src/schematics/add-to-project/index.ts",
"chars": 5996,
"preview": "import { Tree } from \"@angular-devkit/schematics/src/tree/interface\";\nimport { SchematicContext, chain, Rule, externalSc"
},
{
"path": "src/schematics/add-to-project/schema.json",
"chars": 365,
"preview": "{\n \"$schema\": \"http://json-schema.org/schema\",\n \"id\": \"ngtron-generate\",\n \"title\": \"NGTron application schematic\",\n "
},
{
"path": "src/schematics/application/index.ts",
"chars": 11269,
"preview": "import { Tree } from '@angular-devkit/schematics/src/tree/interface';\nimport { SchematicContext, chain, Rule, externalSc"
},
{
"path": "src/schematics/application/schema.json",
"chars": 783,
"preview": "{\n \"$schema\": \"http://json-schema.org/schema\",\n \"id\": \"ngtron-generate\",\n \"title\": \"NGTron application schematic\",\n "
},
{
"path": "src/schematics/collection.json",
"chars": 549,
"preview": "{\n \"$schema\": \"../../node_modules/@angular-devkit/schematics/collection-schema.json\",\n \"schematics\": {\n \"ng-add\": {"
},
{
"path": "src/schematics/files/electron/package.json",
"chars": 80,
"preview": "{\n \"version\": \"0.0.0\",\n \"name\": \"myapp\",\n \"main\": \"\",\n \"dependencies\": {}\n}\n"
},
{
"path": "src/schematics/files/main/src/main.ts",
"chars": 606,
"preview": "import { join } from 'path';\nimport { format } from 'url';\nimport { app, BrowserWindow } from 'electron';\n\n\nfunction cre"
},
{
"path": "src/schematics/files/main/tsconfig.json",
"chars": 79,
"preview": "{\n \"compilerOptions\": {\n \"types\": [\"node\"]\n },\n \"include\": [\"**/*.ts\"]\n}\n"
},
{
"path": "src/schematics/ng-add/index.ts",
"chars": 2267,
"preview": "import {\n addPackageJsonDependency,\n NodeDependency,\n NodeDependencyType,\n} from '@schematics/angular/utility/d"
},
{
"path": "src/schematics/ng-add/schema.json",
"chars": 363,
"preview": "{\n \"$schema\": \"http://json-schema.org/schema\",\n \"id\": \"ngtron-ng-add\",\n \"title\": \"NGTron ng-add schematic\",\n \"type\":"
},
{
"path": "tsconfig.json",
"chars": 616,
"preview": "{\n \"compilerOptions\": {\n \"baseUrl\": \"tsconfig\",\n \"lib\": [\"es2018\", \"dom\"],\n \"declaration\": true,\n \"module\":"
},
{
"path": "tslint.json",
"chars": 1793,
"preview": "{\n \"extends\": \"tslint:recommended\",\n \"rulesDirectory\": [\n \"codelyzer\"\n ],\n \"rules\": {\n \"array-type\": false,\n "
}
]
About this extraction
This page contains the full source code of the BenjaminDobler/ngtron GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 97 files (152.5 KB), approximately 50.3k tokens, and a symbol index with 56 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.