Comment on page
Update to Angular 14
As part of the continuous improvement efforts, we are updating all our front-end frameworks to the latest Angular major release version (14).
The following table shows the LTS Ends dates for the current Angular releases:
The official WebMap packages versions that are compatible with Angular 14 are:
Repository | Name | Version |
AngularClient | @mobilize/angularclient | 9.0.0 |
BaseComponents | @mobilize/base-components | 9.0.0 |
WFNetKendoComponents | @mobilize/winforms-components | 9.0.0 |
WebFormsComponents | @mobilize/webformscomponents | 3.0.0 |
WFNetJanus | @mobilize/jns-winforms-components | 4.0.0 |
WFNetAccess | @mobilize/acs-winforms-components | 0.2.0-rc2844 |
WFNetC1Components | mobilize/wfnet-c1-components | 2.0.0 |
Updating an already migrated project you should follow this process:
- 1.Install Node.js, version 16.20 or above is required
- 1.Download the latest Node.js release from its official download page and install the new Node.js release.
- 2.
- 2.You must update your angular/cli version to version 14
- 1.First uninstall your current version with command and clean cache:
yarn global remove @angular/cli or npm uninstall -g @angular/cliyarn cache clean or npm cache verify 3. Install the 14 version:
yarn global add @angular/[email protected] ornpm install -g @angular/[email protected]Project updates can be performed both manually or using the Angular CLI Tool.
The first recommendation is to generate your new Angular 14 upgraded code through the Conversion Tool same as the first time.
You can also use the Angular CLI tool to migrate your WebMap project automatically from Angular 13 to 14.
Compile your migrated application with ng build, also you can compile with
ng build --configuration=production for the production mode.- 1.Maybe you going to need more RAM for the compilation process, please use node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build to assign 8 GB of RAM.
With the update to Angular 13 we also moved from the deprecated TSLint (https://www.npmjs.com/package/tslint) to ESLint (https://www.npmjs.com/package/eslint) and enable the Prettier code formatter for our components frameworks to keep a clean and tidy code.
To take full advantage of these changes we strongly recommend you install some extensions for your Visual Studio Code:
- Prettier - Code formatter: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
- Remove (if installed) the TSLint extension: https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-tslint-plugin
With these extensions you will be able to format your code according the expected ESLint standard. Also, it will report you directly on the editor any possible error that you introduce in the code files.
Sample ESLint Error on VSCode
Last modified 3mo ago