Menu
Angular 12 comes with default prod mode, how can we keep old dev mode ON? We are missing the sourcemap and the main.js is also minified by default which is cool but does not help in developer mode.
So the question is how to turn back to old dev mode or generate sourcemap and not minify. Tried updating the configuration in angular.json but did not work.
"optimization": {
"scripts": false,
"styles": {
"minify": false,
"inlineCritical": false
},
"fonts": false
},
"outputHashing": "none",
"sourceMap": true,
"extractCss": true,
919
Development build produces source map files whereas production builds not. Source map files help us easily debug our application even after the files are compressed and compiled. It holds information about original files and can be used to map the code within a compressed file back to its position in source files.
The application builder uses the webpack build tool, with default configuration options specified in the workspace configuration file ( angular.
I am also facing this issue and unable to find dev mode for angular 12. As you cannot debug in Prod mode as there won't be any source map in the browser. Just downgrade to Angular 11+ and wait till the Ionic team will give official support for Angular 12. stackoverflow.com/questions/67647471/… Here is the answer. Try it. it worked for me.
In Angular version 12, running ng build now defaults to production mode. This is a welcomed change, as there is less chance of accidentally deploying a development build to production, which is a lot slower and bigger, giving the perception that Angular is slow. This also aligns with other web frameworks that build for production out of the box.
A few days after the release of Angular 12, the Angular team has announced the availability of brand new Angular Dev Tools for Google Chrome. You can download those here. Using that brand new browser extension, you can easily inspect your Angular applications during development.
Build time dependencies the same as in ts example: Due to angular using decorators, if we build an app with ts configuration as we have from the other application the build will fail: In this article, we have seen a minimal set up to start playing with angular.
I've just added a development section under build/configurations
"development": {
"optimization": false,
"sourceMap": true,
"namedChunks": true,
"extractLicenses": true,
"vendorChunk": true,
"buildOptimizer": false,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "6mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "6kb",
"maximumError": "10kb"
}
]
}
And under serve/configurations:
"development": {
"browserTarget": "studio:build:development"
}
and I run the app with ng serve myapp --configuration development
130
From official docs
--prod Deprecated: Use --configuration production instead.
The default configuration is set to production for ng build when a new project generated.
You have 2 options
ng build --configuration development
angular.json fileprojects > {YOUR-PROJECT-NAME} > architect > build > defaultConfiguration
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
