npm link method

Author: wibjorn

contribution-guidelines-engineering.md

@@ -28,7 +28,20 @@ This post provides some contribution guidelines for CSS/Scss in Atlas.
 
 ## When updating existing Scss
 
-- try using [`npm link`](https://docs.npmjs.com/cli/v7/commands/npm-link) to view the impact on existing systems that import Atlas.
+Try using [`npm link`](https://docs.npmjs.com/cli/v7/commands/npm-link) to view the impact on existing systems that import Atlas.
+
+1. Checkout Atlas branch. Ex: xyz/feature-name
+1. `cd ./css; npm link` This creates a symlink between your local repo and atlas-css npm package on your machine installed globally.
+1. Checkout a branch in a downstream repo. Ex. xyz/feature-name-atlas
+1. `cd ./package/using-atlas-css/; npm link @microsoft/atlas-css`. This will create a reference to the global package we just symlinked. Note that `/package/using-atlas-css/` is a fictional name for illustration only.
+1. However! one more step is necessary I found ... go in and delete /package/using-atlas-css/node_modules/@microsoft/atlas-css folder.
+1. If the above isn't working, you'll see a CSS build error related to the new usage of the layout css module.
+1. After that, you should be good to run your start/build commands and visit an a page to test local atlas.
+1. Depending on how your downstream repo is set up, you may need to retrigger builds/watchers or bust cache by making changes to css files if you're developing in tandem.
+
+Maybe also do this:
+
+1. Also tried removing package-lock and reinstalling,
 
 ## Enable the Changeset bot with a fine-grain PAT