From a3a928184fc1debd62be4d0d0a88cfb4c5584bda Mon Sep 17 00:00:00 2001 From: Muhammad Date: Tue, 25 Jan 2022 12:04:43 +0200 Subject: [PATCH] added project structure for v12.2 --- ReadMe.md | 31 ++++++++++- angular.json | 82 ++++++++++++++++++++++++++++ package.json | 31 +++++++++++ src/app/app.component.css | 0 src/app/app.component.html | 1 + src/app/app.component.ts | 8 +++ src/app/app.module.ts | 12 ++++ src/assets/.keep | 0 src/environments/environment.prod.ts | 3 + src/environments/environment.ts | 12 ++++ src/index.html | 13 +++++ src/main.ts | 12 ++++ src/polyfills.ts | 1 + src/styles.css | 0 tsconfig.app.json | 15 +++++ tsconfig.json | 30 ++++++++++ 16 files changed, 248 insertions(+), 3 deletions(-) create mode 100644 angular.json create mode 100644 package.json create mode 100644 src/app/app.component.css create mode 100644 src/app/app.component.html create mode 100644 src/app/app.component.ts create mode 100644 src/app/app.module.ts create mode 100644 src/assets/.keep create mode 100644 src/environments/environment.prod.ts create mode 100644 src/environments/environment.ts create mode 100644 src/index.html create mode 100644 src/main.ts create mode 100644 src/polyfills.ts create mode 100644 src/styles.css create mode 100644 tsconfig.app.json create mode 100644 tsconfig.json diff --git a/ReadMe.md b/ReadMe.md index 4b6a126..6441fbc 100644 --- a/ReadMe.md +++ b/ReadMe.md @@ -1,8 +1,33 @@ -## Angular Minimal +## Angular 12 -This repository contains a minimal working application - does nothing - using Angular Framework. +This branch for Angular 12, For other versions navigate to its branch. + +The content for this repo is: + +``` + + package.json (update the basic proeprties e.g. name, version, description ...etc) + + angular.json (update defaultProject and replace the value "app-starter" with your application name) + + tsconfig.json + + tsconfig.app.json + + ReadMe.md + + LICENSE + + src/ + + main.ts + + polyfills.ts + + styles.css (empty) + + index.html (you need to change title) + + assets/ + + .keep (dummy file to checkin the directory in git) + + environments/ + + environment.ts + + environment.prod.ts + + app/ + + app.module.ts + + app.component.ts + + app.component.css (empty) + + app.component.html (render router-outlet) +``` -Please navigate to the branch with specific angular version you need. ## License This repository is licensed to under MIT License. diff --git a/angular.json b/angular.json new file mode 100644 index 0000000..8365e5a --- /dev/null +++ b/angular.json @@ -0,0 +1,82 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "version": 1, + "newProjectRoot": "projects", + "defaultProject": "app-starter", + "projects": { + "app-starter": { + "projectType": "application", + "schematics": { + "@schematics/angular:application": { + "strict": true + } + }, + "root": "", + "sourceRoot": "src", + "prefix": "app", + "architect": { + "build": { + "builder": "@angular-devkit/build-angular:browser", + "options": { + "outputPath": "dist", + "index": "src/index.html", + "main": "src/main.ts", + "polyfills": "src/polyfills.ts", + "tsConfig": "tsconfig.app.json", + "assets": [ + "src/assets" + ], + "styles": [ + "src/styles.css" + ], + "scripts": [] + }, + "configurations": { + "production": { + "budgets": [ + { + "type": "initial", + "maximumWarning": "500kb", + "maximumError": "1mb" + }, + { + "type": "anyComponentStyle", + "maximumWarning": "2kb", + "maximumError": "4kb" + } + ], + "fileReplacements": [ + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.prod.ts" + } + ], + "outputHashing": "all" + }, + "development": { + "buildOptimizer": false, + "optimization": false, + "vendorChunk": true, + "extractLicenses": false, + "sourceMap": true, + "namedChunks": true + } + }, + "defaultConfiguration": "production" + }, + "serve": { + "builder": "@angular-devkit/build-angular:dev-server", + "configurations": { + "production": { + "browserTarget": "app-starter:build:production" + }, + "development": { + "browserTarget": "app-starter:build:development" + } + }, + "defaultConfiguration": "development" + } + } + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..6d4a1c3 --- /dev/null +++ b/package.json @@ -0,0 +1,31 @@ +{ + "name": "angular-app", + "version": "0.0.0", + "description": "minimum angular app", + "author": "Muhammad Aladdin", + "license": "MIT", + "scripts": { + "ng": "ng", + "start": "ng serve", + "build": "ng build", + "watch": "ng build --watch --configuration development" + }, + "dependencies": { + "@angular/common": "~12.2.0", + "@angular/compiler": "~12.2.0", + "@angular/core": "~12.2.0", + "@angular/platform-browser": "~12.2.0", + "@angular/platform-browser-dynamic": "~12.2.0", + "@angular/router": "~12.2.0", + "rxjs": "~6.6.7", + "tslib": "^2.3.0", + "zone.js": "~0.11.4" + }, + "devDependencies": { + "@angular-devkit/build-angular": "~12.2.0", + "@angular/cli": "~12.2.0", + "@angular/compiler-cli": "~12.2.0", + "@types/node": "^12.12.6", + "typescript": "~4.3.5" + } +} diff --git a/src/app/app.component.css b/src/app/app.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/app.component.html b/src/app/app.component.html new file mode 100644 index 0000000..0680b43 --- /dev/null +++ b/src/app/app.component.html @@ -0,0 +1 @@ + diff --git a/src/app/app.component.ts b/src/app/app.component.ts new file mode 100644 index 0000000..acb092c --- /dev/null +++ b/src/app/app.component.ts @@ -0,0 +1,8 @@ +import { Component } from "@angular/core"; + +@Component({ + selector: 'app-root', + templateUrl: './app.component.html', + styleUrls: ['./app.component.css'] +}) +export class AppComponent { } diff --git a/src/app/app.module.ts b/src/app/app.module.ts new file mode 100644 index 0000000..5b77de0 --- /dev/null +++ b/src/app/app.module.ts @@ -0,0 +1,12 @@ +import { NgModule } from '@angular/core'; +import { BrowserModule } from '@angular/platform-browser'; +import { RouterModule } from '@angular/router'; + +import { AppComponent } from './app.component'; + +@NgModule({ + declarations: [AppComponent], + bootstrap: [AppComponent], + imports: [BrowserModule, RouterModule] +}) +export class AppModule { } \ No newline at end of file diff --git a/src/assets/.keep b/src/assets/.keep new file mode 100644 index 0000000..e69de29 diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts new file mode 100644 index 0000000..3612073 --- /dev/null +++ b/src/environments/environment.prod.ts @@ -0,0 +1,3 @@ +export const environment = { + production: true +}; diff --git a/src/environments/environment.ts b/src/environments/environment.ts new file mode 100644 index 0000000..a12a714 --- /dev/null +++ b/src/environments/environment.ts @@ -0,0 +1,12 @@ +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/plugins/zone-error'; // Included with Angular CLI. diff --git a/src/index.html b/src/index.html new file mode 100644 index 0000000..0a36d7b --- /dev/null +++ b/src/index.html @@ -0,0 +1,13 @@ + + + + + + + + Minimum Angular App Starter + + + + + diff --git a/src/main.ts b/src/main.ts new file mode 100644 index 0000000..c7b673c --- /dev/null +++ b/src/main.ts @@ -0,0 +1,12 @@ +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)); diff --git a/src/polyfills.ts b/src/polyfills.ts new file mode 100644 index 0000000..fd47e4c --- /dev/null +++ b/src/polyfills.ts @@ -0,0 +1 @@ +import 'zone.js'; \ No newline at end of file diff --git a/src/styles.css b/src/styles.css new file mode 100644 index 0000000..e69de29 diff --git a/tsconfig.app.json b/tsconfig.app.json new file mode 100644 index 0000000..82d91dc --- /dev/null +++ b/tsconfig.app.json @@ -0,0 +1,15 @@ +/* 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" + ] +} diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..6df8283 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,30 @@ +/* To learn more about this file see: https://angular.io/config/tsconfig. */ +{ + "compileOnSave": false, + "compilerOptions": { + "baseUrl": "./", + "outDir": "./dist/out-tsc", + "forceConsistentCasingInFileNames": true, + "strict": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true, + "sourceMap": true, + "declaration": false, + "downlevelIteration": true, + "experimentalDecorators": true, + "moduleResolution": "node", + "importHelpers": true, + "target": "es2017", + "module": "es2020", + "lib": [ + "es2018", + "dom" + ] + }, + "angularCompilerOptions": { + "enableI18nLegacyMessageIdFormat": false, + "strictInjectionParameters": true, + "strictInputAccessModifiers": true, + "strictTemplates": true + } +}