Menu
Do we need Babel in an Angular 5 application? What AOT or JIT is being used internally to compile?
453
Since Angular utilizes decorators and class properties heavily and Babel doesn't support them in those presets, we need to add them manually. Please note that plugin-proposal-decorators needs to be additionally configured — we need to use legacy decorators mode.
AOT. JIT downloads the compiler and compiles code exactly before Displaying in the browser. AOT has already complied with the code while building your application, so it doesn't have to compile at runtime. Loading in JIT is slower than the AOT because it needs to compile your application at runtime.
The Angular Compiler (which we call ngc ) is the tool used to compile Angular applications and libraries. ngc is built on the TypeScript compiler (called tsc ) and extends the process of compiling TypeScript code to add additional code generation related to Angular's capabilities.
Babel is a JavaScript compiler Babel is a toolchain that is mainly used to convert ECMAScript 2015+ code into a backwards compatible version of JavaScript in current and older browsers or environments.
You don't need to worry about babel in an angular 2+ application.
You configure the ECMAscript level in the tsconfig.app.json file in you project.
(be sure you initiated your project with angular's angular-cli)
example (angular 8):
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"baseUrl": "./",
"types": []
},
"exclude": [
"node_modules",
"test.ts",
"**/*.spec.ts"
]
}
example (angular 5) :
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"baseUrl": "./",
"module": "es2015", //<-- can aslo be es5 es6 es7
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}
typescript, angular's filesystem includes a very complete bundle of all the other goodies there exist in the JS biosphere :
153
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
