I have setup the NX monorepo with micro-frontends. I have array of applications such as: app1, app2, app3, ..., app7. I also created two buildable libraris: 1. common (non ui shared logic) 2. common-ui (shared ui components). I am using both the libraries in all the applications. I am storing remotes (mfs) on azure blob storage with release pipeline.
On local, it wokrs as expected as I am running host with all the remotes.
But I am facing one weird behaviour while deploying the host and remotes. here is the problem-statement: I want to build my common and common-ui with "host" app only, but for some weird reason, when I change something on common-ui, I need to re-deploy the "app1", in order to reflact the changes. Even though I haven't changed anything in the "app1".
How can I configured the NX workspace, that when I build "host" app for prod, common & common-ui should also build.
When I load my application, all the common-ui code comes from the "app1" location. ex: url/app1/file.js.
I have tried to check all the config files, such nx.json & tsconfig.base.json where paths are declared.
nx.json
{
"$schema": "./node_modules/nx/schemas/nx-schema.json",
"npmScope": "1talent",
"tasksRunnerOptions": {
"default": {
"runner": "nx/tasks-runners/default",
"options": {
"cacheableOperations": ["build", "lint", "test", "e2e"]
}
}
},
"targetDefaults": {
"build": {
"dependsOn": ["^build"]
},
"test": {
"inputs": ["default", "^default", "{workspaceRoot}/jest.preset.js"]
},
"lint": {
"inputs": ["default", "{workspaceRoot}/.eslintrc.json"]
}
},
"generators": {
"@nrwl/react": {
"application": {
"style": "css",
"linter": "eslint",
"babel": true
},
"component": {
"style": "css"
},
"library": {
"style": "css",
"linter": "eslint"
}
}
},
"defaultProject": "host"
}
tsconfig.base.json
"compileOnSave": true,
"compilerOptions": {
"rootDir": ".",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es2015",
"module": "esnext",
"lib": ["es2017", "dom"],
"skipLibCheck": true,
"skipDefaultLibCheck": true,
"baseUrl": ".",
"paths": {
"@myApp/common": ["libs/common/src/index.ts"],
"@myApp/common-ui": ["libs/common-ui/src/index.ts"]
}
},
"exclude": ["node_modules", "tmp"]
}