6fb39d9b62
This implements `onDidChangedWatchedFiles` in the language server, which allows the client to communicate changes to files rather than having the server create system file/directory watchers. This option is enabled in the extension via the `angular.server.useClientSideFileWatcher` setting. When enabled, the extension registers a FileSystemWatcher for .ts, .html, and package.json files and forwards events to the server. The server completely disables its internal native file watchers (via a new 'ServerHost' implementation that stubs watchFile/watchDirectory). This is significantly more performant and reliable than native watching for several reasons: - Deduplication: VS Code already watches the workspace. Piggybacking on these events prevents the server from duplicating thousands of file watchers. - OS Limits: Since the server opens zero watcher handles, it is impossible to hit OS limits (ENOSPC), no matter how large the repo is. - Optimization: VS Code's watcher uses highly optimized native implementations (like Parcel Watcher in Rust/C++) which handle recursive directory watching far better than Node.js's 'fs.watch'. - Debouncing: The client aggregates extremely frequent file events (e.g., during 'git checkout'), reducing the flood of processing requests to the server. This option was tested in one very large internal project and observed ~10-50x improvement of initialization times. fixes #66543 |
||
|---|---|---|
| .. | ||
| client | ||
| common | ||
| docs | ||
| integration | ||
| server | ||
| syntaxes | ||
| tools | ||
| angular.png | ||
| BUILD.bazel | ||
| CHANGELOG.md | ||
| DEVELOPER.md | ||
| package.json | ||
| README.md | ||
| tsconfig-test.json | ||
| tsconfig.json | ||
Angular Language Service
Features
This extension provides a rich editing experience for Angular templates, both inline and external templates including:
- Completions lists
- AOT Diagnostic messages
- Quick info
- Go to definition
Download
Download the extension from Visual Studio Marketplace.
Configuring compiler options for the Angular Language Service
The Angular Language Service uses the same set of options that are used to compile the application.
To get the most complete information in the editor, set the strictTemplates option in tsconfig.json,
as shown in the following example:
"angularCompilerOptions": {
"strictTemplates": true
}
For more information, see the Angular compiler options guide.
Versioning
The language service extension relies on the @angular/language-service and typescript packages
for its backend. @angular/language-service is always bundled with the extension, and is always
the latest version at the time of the release.
typescript is loaded, in order of priority, from:
- The path specified by
typescript.tsdkin project or global settings. - (Recommended) The version of
typescriptbundled with the Angular Language Service extension. - The version of
typescriptpresent in the current workspace's node_modules.
We suggest not specifying typescript.tsdk in your VSCode settings
per method (1) above. If the typescript package is loaded by
methods (1) or (3), there is a potential for a mismatch between
the API expected by @angular/language-service and the API provided by typescript. This could
lead to a failure of the language service extension.
For more information, please see #594.
Installing a particular release build
Download the .vsix file for the release that you want to install from the releases tab.
Do not open the .vsix file directly. Instead, in Visual Studio code, go to the extensions tab. Click on the "..." menu in the upper right corner of the extensions tab, select "Install from vsix..." and then select the .vsix file for the release you just downloaded.
The extension can also be installed with the following command:
code --install-extension /path/to/ngls.vsix
Angular Language Service for Other Editors
- coc-angular for (Neo)vim
- nvim-lspconfig for Neovim
- Wild Web Developer for Eclipse
- lsp-mode for Emacs