{"library":"parcel-plugin-angular","title":"Angular Support for Parcel 1","description":"parcel-plugin-angular is an abandoned Parcel plugin, currently at version 0.5.0, designed to provide comprehensive Angular support for the Parcel 1 bundler. It enables features like AOT (Ahead-of-Time) compilation using the official Angular compiler, lazy loading of Angular modules, and automatic processing of templates and styles. The plugin also performs transformations, such as decorator removal in AOT mode for smaller bundles and replacing JIT bootstrap code with AOT. It explicitly requires Parcel 1.x and Angular versions around 5.1.0, along with their associated compiler tools. Due to the release of Parcel 2 with a completely redesigned plugin system in September 2021, this plugin is no longer maintained or compatible with modern Parcel versions or recent Angular releases. Its release cadence was irregular and it has not seen updates since 2018.","language":"javascript","status":"abandoned","last_verified":"Thu Apr 23","install":{"commands":["npm install parcel-plugin-angular"],"cli":null},"imports":["import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';","import { enableProdMode } from '@angular/core';","import { AppModule } from './app/app.module';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"{\n  \"name\": \"my-angular-parcel-app\",\n  \"version\": \"1.0.0\",\n  \"scripts\": {\n    \"start\": \"parcel index.html\",\n    \"build\": \"parcel build index.html\"\n  },\n  \"devDependencies\": {\n    \"parcel-bundler\": \"^1.1.0\",\n    \"parcel-plugin-angular\": \"^0.5.0\",\n    \"@angular/common\": \"^5.1.0\",\n    \"@angular/compiler\": \"^5.1.0\",\n    \"@angular/compiler-cli\": \"^5.1.0\",\n    \"@angular/core\": \"^5.1.0\",\n    \"@angular/platform-browser\": \"^5.1.0\",\n    \"@angular/platform-browser-dynamic\": \"^5.1.0\",\n    \"rxjs\": \"^5.5.0\",\n    \"typescript\": \">=2.4.2 <2.6\",\n    \"zone.js\": \"^0.8.0\"\n  }\n}\n// tsconfig.json\n{\n  \"compilerOptions\": {\n    \"target\": \"es5\",\n    \"module\": \"es2015\",\n    \"moduleResolution\": \"node\",\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true,\n    \"lib\": [\"es2017\", \"dom\"],\n    \"skipLibCheck\": true,\n    \"typeRoots\": [\n      \"node_modules/@types\"\n    ]\n  },\n  \"angularCompilerOptions\": {\n    \"fullTemplateTypeCheck\": true,\n    \"strictMetadataEmit\": true\n  },\n  \"parcelAngularOptions\": {\n    \"watch\": \"jit\",\n    \"build\": \"aot\"\n  }\n}\n// index.html\n<!DOCTYPE html>\n<html>\n<head>\n  <title>Parcel Angular App</title>\n</head>\n<body>\n  <app-root></app-root>\n  <script src=\"main.ts\"></script>\n</body>\n</html>\n// main.ts\nimport { enableProdMode } from '@angular/core';\nimport { platformBrowserDynamic } from '@angular/platform-browser-dynamic';\nimport { AppModule } from './app/app.module';\n\nif (process.env.NODE_ENV === 'production') {\n  enableProdMode();\n}\n\nplatformBrowserDynamic().bootstrapModule(AppModule)\n  .catch(err => console.error(err));\n// app/app.module.ts\nimport { NgModule } from '@angular/core';\nimport { BrowserModule } from '@angular/platform-browser';\nimport { AppComponent } from './app.component';\n\n@NgModule({\n  imports: [BrowserModule],\n  declarations: [AppComponent],\n  bootstrap: [AppComponent]\n})\nexport class AppModule { }\n// app/app.component.ts\nimport { Component } from '@angular/core';\n\n@Component({\n  selector: 'app-root',\n  template: '<h1>Hello from Angular with Parcel!</h1>'\n})\nexport class AppComponent { }\n","lang":"typescript","description":"This quickstart demonstrates setting up a basic Angular 5 application using parcel-plugin-angular with Parcel 1. It includes the necessary `package.json` for dependencies and scripts, `tsconfig.json` for Angular and Parcel plugin options, and minimal Angular component and module files. To run, save these files, then execute `npm install` and `npm start`.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}