Skip to main content

Link angular projects locally

Problem​

You want to modify the dwp-core repository, but still want hot reload functionality when working in dwp-app

dpw-core > dwp-app​

Build and watch the dwp-core projects that you want work on. This example uses dwp-core project​

IMPORTANT! For AkerBP atleast, we need to run npm run build_lib if it's the first ever build!​

  • cd .\dwp-core
  • npm run build_watch:dwp-core
  • Open another terminal and go to the build output folder dist
  • cd <gitrepos>\dwp-core\dist
  • Go to the built project folder
  • cd .\dwp-core
  • Run npm link
  • This will create a reference from global node_modules in your %APPDATA% to the local version of the code

Setup dwp-app to use the new reference​

  • cd <gitrepos>\dwp-app\src\iwp-app
  • npm link @dswc/dwp-core

The command should output something like this:

D:\code\dwp-app\src\iwp-app\node_modules\@dswc\dwp-core -> %APPDATA%\npm\node_modules\@dswc\dwp-core -> D:\code\dwp-core\dist\dwp-core

Meaning a symbolic link is created from the global node_modules folder to the local version of the code

You can verify that link by listing the node_modules folder in dwp-app

ls .\node_modules\@dswc

alt text

dwp-akerbp-lib -> dwp-app​

cd gitrepos\dwp-akerbp-lib\src\iwp-app

Build the project you want to change (check scripts section of package.json)

  • To build all run
npm run build
  • To link all run .\npm_linksnlp.bat

Otherwise:

  • npm run build-lib:target-summary
  • cd dwp-akerbp-lib\src\iwp-app\dist\target-summary
  • npm link
  • npm run watch-lib:target-summary
  • Open a new terminal
  • cd gitrepos\dwp-app\src\iwp-app
  • npm link @snowleopard/target-summary
  • npm start

dwp-landing-page -> dwp-app​

Almost same as above

  • npm run build_watch (this will also link)
  • Open a new terminal go to the dwp-app repo
  • cd gitrepos\dwp-app\src\iwp-app
  • npm run link_landing_page
  • npm start

Go to your repository where you want to unlink the local code

cd <gitrepos>\dwp-app\src\iwp-app

npm unlink @dswc/package1 @snowleopard/package2 --no-save

Or do it manually​

Remove the symbolic link from node_modules

Remove-Item -Path .\node_modules\@dswc\dwp-core -Force -Recurse
#Restore original packages
npm install

or

rm -rf /node_modules/@dswc/dwp-core
#restore original packages
npm install

Tips​

npm link package1 package2 package3

Viewing packages available for linking​

npm ls -g --depth 0

Output:

alt text

Checking if the packages are linked in the repo you're working on​

alt text

alt text

Connecting...