Create symlink from AngularJS dist folder to a different Angular.io dist folder

Question

I'm working on a project that is made of an AngularJS app (I'll call it appjs ) and an Angular.io (v6) app (that I'll call appio ). On production, it works as follows:

• appio is built with ng build.
• appjs is built with npm run build.
• appjs is served with Apache, but appio is served through a symlink that is included in appjs/dist. This symlink is automatically created on production.

So, imagine that appio controls the /login. When someone wants to login in the app, it will be redirected to something like:

test.com/appjs/appio/login (where appio is the symlink I was talking about.)

This works... for now, on production, but on development every time the project is built, I have to create the symlink manually, as every time a change in appjs is done, appjs's dist folder is entirely rebuilt and the symlink is lost.

I have tried Webpack Shell Plugin to automate the symlink creation with something like

ln -s ~/appio/dist/appio/ ~/appjs/dist/appio

but it's onBuildEnd event happens before dist folder is created.

Does someone knows how could I automatically inject this symlink into the appjs's dist folder?

I would like to clarify I did not create this project's architecture.

Thanks a lot.

Answer 1

I just solved the problem. 1. Create the symlink in the src folder (or wherever your code is) 2. Add cleanup plug in to your webpack config 3. Inside the plugin config, exclude the symlink file After every compilation, webpack will just copy the symlink to the dist folder.