{"id":49039624,"url":"https://github.com/sebheron/monaco-angular","last_synced_at":"2026-04-19T14:13:15.978Z","repository":{"id":346706934,"uuid":"1191235615","full_name":"sebheron/monaco-angular","owner":"sebheron","description":"Web worker for the Angular language service inside the Monaco Editor","archived":false,"fork":false,"pushed_at":"2026-04-17T06:12:59.000Z","size":8283,"stargazers_count":0,"open_issues_count":4,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2026-04-17T08:18:22.161Z","etag":null,"topics":["angular","language-server","monaco-editor","web-worker"],"latest_commit_sha":null,"homepage":"https://sebheron.github.io/monaco-angular","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sebheron.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-03-25T03:33:34.000Z","updated_at":"2026-04-17T06:10:55.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/sebheron/monaco-angular","commit_stats":null,"previous_names":["sebheron/monaco-angular-ls"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/sebheron/monaco-angular","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sebheron%2Fmonaco-angular","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sebheron%2Fmonaco-angular/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sebheron%2Fmonaco-angular/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sebheron%2Fmonaco-angular/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sebheron","download_url":"https://codeload.github.com/sebheron/monaco-angular/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sebheron%2Fmonaco-angular/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32009294,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-18T20:23:30.271Z","status":"online","status_checked_at":"2026-04-19T02:00:07.110Z","response_time":55,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","language-server","monaco-editor","web-worker"],"created_at":"2026-04-19T14:13:15.288Z","updated_at":"2026-04-19T14:13:15.960Z","avatar_url":"https://github.com/sebheron.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Monaco Angular\nAngular language plugin for the Monaco Editor. It bundles the entire angular language service into a web worker so it can run locally and offline. It can be used alongside tools like [esbuild-wasm](https://www.npmjs.com/package/esbuild-wasm) to build entirely web based Angular development environments.\n\nThere are some features such as code fixes and refactorings that are not currently implemented. However, the core features of the language service are completely working.\n\n[Sandbox Demo](https://sebheron.github.io/monaco-angular/)\n\n## Installation\n```bash\nnpm install monaco-angular\n```\nor\n```bash\npnpm install monaco-angular\n```\n\n## Usage\n\n### Setting up the worker\nThe package exposes both the worker and a function to setup the worker. `setupAngularWorker` must be called before the editor is intialised as it patches some of the monaco editor's internals. To enable html template support, the `angularWorker` must be created outside of the `getWorker` function and returned for both **typescript** and **html** labels. Other labels like css, sass, etc. are supported but largely untested as of now.\n```typescript\nimport setupAngularWorker from 'monaco-angular';\nimport angularWorker from 'monaco-angular/worker?worker';\nimport editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';\n\nsetupAngularWorker();\nconst angularWorkerInstance = new angularWorker();\n\nself.MonacoEnvironment = {\n    getWorker(_, label) {\n        if (label === 'typescript' || label === 'html') {\n            return angularWorkerInstance;\n        }\n        else {\n            return new editorWorker();\n        }\n    },\n};\n```\n\n### Enabling angular types\nBy default the language service doesn't bundle any of the angular types. The easiest way to add these (if you're using vite/angular-cli as your bundler) is to import the raw declaration files into your project and declare them as **extraLibs**.\n\n```typescript\nimport coreDTS from '../node_modules/@angular/core/types/core.d.ts?raw';\nimport primitivesDiDTS from '../node_modules/@angular/core/types/primitives-di.d.ts?raw';\nimport primitivesEventDispatchDTS from '../node_modules/@angular/core/types/primitives-event-dispatch.d.ts?raw';\nimport primitivesSignalsDTS from '../node_modules/@angular/core/types/primitives-signals.d.ts?raw';\nimport rxjsInteropDTS from '../node_modules/@angular/core/types/rxjs-interop.d.ts?raw';\nimport testingDTS from '../node_modules/@angular/core/types/testing.d.ts?raw';\nimport apiChunkDTS from '../node_modules/@angular/core/types/_api-chunk.d.ts?raw';\nimport chromeDevToolsPerformanceChunkDTS from '../node_modules/@angular/core/types/_chrome_dev_tools_performance-chunk.d.ts?raw';\nimport discoveryChunkDTS from '../node_modules/@angular/core/types/_discovery-chunk.d.ts?raw';\nimport effectChunkDTS from '../node_modules/@angular/core/types/_effect-chunk.d.ts?raw';\nimport eventDispatcherChunkDTS from '../node_modules/@angular/core/types/_event_dispatcher-chunk.d.ts?raw';\nimport formatterChunkDTS from '../node_modules/@angular/core/types/_formatter-chunk.d.ts?raw';\nimport weakRefChunkDTS from '../node_modules/@angular/core/types/_weak_ref-chunk.d.ts?raw';\nimport tslibDTS from '../node_modules/tslib/tslib.d.ts?raw';\n\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    coreDTS,\n    'file:///node_modules/@angular/core/index.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    primitivesDiDTS,\n    'file:///node_modules/@angular/core/types/primitives-di.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    primitivesEventDispatchDTS,\n    'file:///node_modules/@angular/core/types/primitives-event-dispatch.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    primitivesSignalsDTS,\n    'file:///node_modules/@angular/core/types/primitives-signals.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    rxjsInteropDTS,\n    'file:///node_modules/@angular/core/types/rxjs-interop.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    testingDTS,\n    'file:///node_modules/@angular/core/types/testing.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    apiChunkDTS,\n    'file:///node_modules/@angular/core/types/_api-chunk.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    chromeDevToolsPerformanceChunkDTS,\n    'file:///node_modules/@angular/core/types/_chrome_dev_tools_performance-chunk.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    discoveryChunkDTS,\n    'file:///node_modules/@angular/core/types/_discovery-chunk.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    effectChunkDTS,\n    'file:///node_modules/@angular/core/types/_effect-chunk.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    eventDispatcherChunkDTS,\n    'file:///node_modules/@angular/core/types/_event_dispatcher-chunk.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    formatterChunkDTS,\n    'file:///node_modules/@angular/core/types/_formatter-chunk.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    weakRefChunkDTS,\n    'file:///node_modules/@angular/core/types/_weak_ref-chunk.d.ts'\n);\nmonaco.typescript.typescriptDefaults.addExtraLib(\n    tslibDTS,\n    'file:///node_modules/tslib/tslib.d.ts'\n);\n\n//Make sure to include some additional compiler options too for tslib and fix paths for the angular imports.\nmonaco.typescript.typescriptDefaults.setCompilerOptions({\n    // Existing compiler options...\n    experimentalDecorators: true,\n    emitDecoratorMetadata: true,\n    baseUrl: '.',\n    paths: {\n        '@angular/*': ['node_modules/@angular/core/*'],\n    },\n});\n```\n\n## Customisation\nThe language service uses a subset of the angular compiler options. You can pass any of these options into the `setupAngularWorker` function to customize its behaviour.\nFor more info: [angular compiler options](https://angular.dev/reference/configs/angular-compiler-options).\n\n```typescript\nexport interface PluginConfig {\n    /**\n     * If true, return only Angular results. Otherwise, return Angular + TypeScript results.\n     */\n    angularOnly?: boolean;\n    /**\n     * If false, disable `strictTemplates` in the language service.\n     */\n    strictTemplates?: boolean;\n    /**\n     * If false, disables parsing control flow blocks in the compiler. Should be used only when older\n     * versions of Angular that do not support blocks (pre-v17) used with the language service.\n     */\n    enableBlockSyntax?: boolean;\n    /**\n     * Version of `@angular/core` that should be used by the language service.\n     */\n    angularCoreVersion?: string;\n    /**\n     * If false, disables parsing of `@let` declarations in the language service.\n     */\n    enableLetSyntax?: boolean;\n    /**\n     * A list of diagnostic codes that should be supressed in the language service.\n     */\n    suppressAngularDiagnosticCodes?: number[];\n}\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsebheron%2Fmonaco-angular","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsebheron%2Fmonaco-angular","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsebheron%2Fmonaco-angular/lists"}