Comment on page
How link WebMap package to the migrated Application
Sometimes when we want to debug a frontend package in the migrated application the process of generating a package, and installing it, and then using it can be a bit slow.
npm has a feature called link, which allows us to link the node_module of a package to an address on the PC's storage. For example, if we have a migrated application and we want to make some changes in the @mobilize/winforms-components repository, you do the yarn install or the npm install that you normally do, but how can you make changes to that package and test them in the migrated application?
Let's assume that you have a migrated project, to which you want to connect the @mobilize/winforms-components repository to test some changes.
Go to the repository path, in my case is D:\Repositories\WFNetKendoComponents\WinformsComponentopen a cmd and compile the application
npm run build
Go with the terminal to the dist folder after compiling the repository, in my case is D:\Repositories\WFNetKendoComponents\WinformsComponent\dist and execute the link command.
> cd dist
> npm link
You should see something like that:
repository: link command
Add a new property preserveSymlinks in the angular.json of the migrated project.
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"angular": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
...
// Add this new line
"preserveSymlinks": true
}
}
}
}
}
}
Open a cmd in the root of the migrated application and execute the next npm link with the package_name:
npm link @mobilize/winforms-components
you should see something like:
link: migrated path
If you check your node_modules you should see a shortcut in your package folder
winforms package as npm link
After link the package, you must compile your application as usual, for example
ng build
or
ng serve
or
npm run debug
Suppose you already did the linking process and you made a change to the @mobilize/winforms-components repository that you want to test in your migrated application.
- 1.Stop the ng serve process if you are using it in the migrated application.
- 2.Compile the repository with the change made.
- 3.Compile the migrated application or start the ng serve process.
- 1.@mobilize/angularclient
- 2.@mobilize/base-components
- 3.@mobilize/winforms-components
- 4.@mobilize/powercomponents
- 5.@mobilize/jns-winforms-components
- 6.@mobilize/acs-winforms-components
You can use one or more linked repositories in a migrated application.
you can execute the unlink command to delete the link folder.
npm unlink
Last modified 3yr ago