How to disable web pack in Angular 14 ?
I am not able to debug my code.
Angular JSON
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"color-admin": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"allowedCommonJsDependencies": [
"lodash"
],
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.app.json",
"polyfills": "src/polyfills.ts",
"assets": [
"src/assets",
"src/favicon.ico"
],
"styles": [
"src/styles.css",
"src/scss/angular.scss"
],
"scripts": []
},
"configurations": {
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "color-admin:build"
},
"configurations": {
"production": {
"browserTarget": "color-admin:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "color-admin:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"karmaConfig": "./karma.conf.js",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json",
"scripts": [],
"styles": [
"src/styles.css"
],
"assets": [
"src/assets",
"src/favicon.ico"
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.app.json",
"src/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
},
"color-admin-e2e": {
"root": "",
"sourceRoot": "",
"projectType": "application",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "./protractor.conf.js",
"devServerTarget": "color-admin:serve"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"e2e/tsconfig.e2e.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
}
},
"defaultProject": "color-admin",
"schematics": {
"@schematics/angular:component": {
"prefix": "app",
"style": "css"
},
"@schematics/angular:directive": {
"prefix": "app"
}
},
"cli": {
"analytics": false
}
}
My Package Json -
{
"name": "color-admin",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build --prod",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"postinstall": "node remove-css-imports.js ngcc"
},
"private": true,
"dependencies": {
"@angular-devkit/build-angular": "~14.2.1",
"@angular/animations": "^14.2.0",
"@angular/cdk": "^14.2.0",
"@angular/cli": "^14.2.1",
"@angular/common": "^14.2.0",
"@angular/compiler": "^14.2.0",
"@angular/compiler-cli": "^14.2.0",
"@angular/core": "^14.2.0",
"@angular/forms": "^14.2.0",
"@angular/language-service": "^14.2.0",
"@angular/localize": "^14.2.0",
"@angular/material": "^14.2.0",
"@angular/platform-browser": "^14.2.0",
"@angular/platform-browser-dynamic": "^14.2.0",
"@angular/router": "^14.2.0",
"@fortawesome/fontawesome-free": "^6.2.0",
"@fullcalendar/angular": "^5.11.2",
"@fullcalendar/bootstrap": "^5.11.3",
"@fullcalendar/core": "^5.11.3",
"@fullcalendar/daygrid": "^5.11.3",
"@fullcalendar/interaction": "^5.11.3",
"@fullcalendar/list": "^5.11.3",
"@fullcalendar/resource-timegrid": "^5.11.3",
"@fullcalendar/timegrid": "^5.11.3",
"@ng-bootstrap/ng-bootstrap": "^13.0.0",
"@ngx-loading-bar/core": "^6.0.2",
"@ngx-loading-bar/router": "^6.0.2",
"@popperjs/core": "^2.11.6",
"@sweetalert2/ngx-sweetalert2": "^11.0.0",
"@swimlane/ngx-charts": "^20.1.0",
"@swimlane/ngx-datatable": "^20.0.0",
"@types/jasmine": "~4.3.0",
"@types/jasminewd2": "~2.0.10",
"@types/node": "^18.7.15",
"@yaireo/tagify": "^4.16.4",
"angular-calendar": "^0.30.1",
"apexcharts": "^3.35.5",
"bootstrap": "^5.2.0",
"bootstrap-icons": "^1.9.1",
"bootstrap-social": "^5.1.1",
"chart.js": "^3.9.1",
"codelyzer": "^6.0.2",
"core-js": "^3.25.0",
"d3": "^7.6.1",
"dart-sass": "^1.25.0",
"date-fns": "^2.29.2",
"dayjs": "^1.11.5",
"fibers": "^5.0.3",
"flag-icon-css": "^4.1.6",
"ionicons": "^6.0.3",
"jasmine-core": "~4.4.0",
"jasmine-spec-reporter": "~7.0.0",
"jquery": "^3.6.1",
"jwt-decode": "^3.1.2",
"karma": "~6.4.0",
"karma-chrome-launcher": "~3.1.1",
"karma-coverage-istanbul-reporter": "~3.0.3",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "^2.0.0",
"lity": "^2.4.1",
"masonry-layout": "^4.2.2",
"moment": "^2.29.4",
"ng-apexcharts": "^1.7.1",
"ng-chartjs": "^0.2.5",
"ng-masonry-layout": "^8.0.2",
"ng2-nvd3": "^2.0.0",
"ngx-color": "^8.0.3",
"ngx-countdown": "^14.0.0",
"ngx-daterangepicker-material": "^6.0.2",
"ngx-editor": "^15.0.0",
"ngx-highlight-js": "^14.0.0",
"ngx-highlightjs": "^7.0.1",
"ngx-masonry": "^13.0.0",
"ngx-nvd3": "^1.0.9",
"ngx-perfect-scrollbar": "^10.1.1",
"ngx-trend": "^8.0.0",
"nvd3": "^1.8.6",
"protractor": "~7.0.0",
"rxjs": "^7.5.6",
"rxjs-compat": "^6.6.7",
"simple-line-icons": "^2.5.5",
"socket.io-client": "^4.5.1",
"sweetalert2": "^11.4.32",
"ts-node": "^10.9.1",
"tslib": "^2.4.0",
"tslint": "~6.1.3",
"typescript": "^4.8.2",
"zone.js": "~0.11.8"
}
}
tsConfig.json
{
"compileOnSave": false,
"compilerOptions": {
"downlevelIteration": true,
"importHelpers": true,
"module": "es2020",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es6",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2015",
"dom"
],
"paths": { "@angular/*": ["../node_modules/@angular/*"] }
}
}
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.log(err));
pollyfills.ts -
/***************************************************************************************************
* Load `$localize` onto the global scope - used if i18n tags appear in Angular templates.
*/
import '@angular/localize/init';
/**
* 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/docs/ts/latest/guide/browser-support.html
*/
/***************************************************************************************************
* BROWSER POLYFILLS
*/
/** IE9, IE10 and IE11 requires all of the following polyfills. **/
// import 'core-js/es6/symbol';
// import 'core-js/es6/object';
// import 'core-js/es6/function';
// import 'core-js/es6/parse-int';
// import 'core-js/es6/parse-float';
// import 'core-js/es6/number';
// import 'core-js/es6/math';
// import 'core-js/es6/string';
// import 'core-js/es6/date';
// import 'core-js/es6/array';
// import 'core-js/es6/regexp';
// import 'core-js/es6/map';
// import 'core-js/es6/weak-map';
// import 'core-js/es6/set';
/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import 'classlist.js'; // Run `npm install --save classlist.js`.
/** IE10 and IE11 requires the following for the Reflect API. */
// import 'core-js/es6/reflect';
/** Evergreen browsers require these. **/
// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
/**
* Required to support Web Animations `@angular/platform-browser/animations`.
* Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
**/
// import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/***************************************************************************************************
* Zone JS is required by default for Angular itself.
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
/***************************************************************************************************
- APPLICATION IMPORTS */
Each and every time I ran my application, its bundled it and run it inside webpack. I am not able to debug my code.
I want some setting where I can enable and disable the webpack.
