Hi everyone I m interes…
Hi everyone! I’m interested in how you would manage to build your apps using Docker and not including all dependencies. Let’s say I have an Angluar app and a React app. Now I create a Dockerfile and a Docker-Compose.yml and I want my image to be the smallest result possible.
What I tried so far is to nx build my-app --production --with-deps and COPY dist/apps/myapp / in my Dockerfile but that results with the container complaining about missing dependencies like axios.
Is there any example on how to build my apps and include all the dependencies that are required for one specific app? Thanks
Responses:
that’s weird. frontend bundles should include dependencies inside the dist/appname folder :thinking_face:
would you mind sharing your build architect configuration? it should be in your workspace.json file
also, what command do you use to start the container?
This is my workspace.json architect build configuration
"architect": {
"build": {
"builder": "@nrwl/next:build",
"options": {
"root": "apps/my-app",
"outputPath": "dist/apps/my-app"
},
"configurations": {
"production": {
"optimization": true,
"vendorChunk": true,
"extractLicenses": true
}
}
},
I use the following to start the container:
"scripts": {
"start": "next start"
},
Thank you for the fast response
next is a node server basically so what you want to do is copy your package.json and the lockfile. then npm i in your container before running it
I’m using nrwl/next btw. A quick fix is to manually copy the dependencies from my root package.json into the dist/apps package.json but that’s just a hack and leads to missing default images from my public folder. As I’M a beginner I didn’t make use of NX libs and placed everything in my apps folder to extract it in a later stage.
if your angular app uses universal to render server side you’ll have to do something similar
An isue with when I copy the /package.json instead of using the /dist/apps/my-app/package.json is that NX is unknown. So I could globally install NX as well to fix that but it would be nice if I simply can run a command like nx build my-app --production and use the bundled files in my Docker container.
i just copy my root package json to the container
with its lockfile
Ah and you change the default start which is nx serve to e.G start:docker : next start ?
Which unfortunatly won’t fix missing favicon.ico and /public/images/ in the bundled files :disappointed:
you shouldn’t use the dev server in production or in the docker container
With dev server everything works fine its when using nx build that the files which are being served in dev aren’t bundled in production and I get 404 errors
Solved by:
```FROM node:12.18.0-alpine
LABEL maintainer=”Matthias Miguel Köhler”
WORKDIR /usr/src/app
COPY apps/my-app/public ./public COPY dist/appsp/my-app . COPY [“package.json”, “yarn.lock”, “./”]
RUN yarn install –production
EXPOSE 3000
CMD [ “yarn”, “start:docker” ]```
There are still open questions that I have:
• Is there a way to have clean dependencies in my Image?
• - Due to the copy instruction of /package.json I have all of the Angular dependencies in my React app as well and vice versa.
:thinking_face:
what i do is I have my frontend dependencies as devDependencies so only the backend ones go to my node docker images. It’s not ideal because you still might end up with dependencies that you don’t need but it’s something :shrug: Another suggested approach is to mantain a separate package.json/lockfile for each node app. but i haven’t seen a solution working that does not involve hands-on manipulation of each packagejson file
I’ve also seen a different approach of having a custom field in the package-json file per project, so you don’t need to maintain the version as well just name of the package, and then loop through the package.json deps and only include those you want
Regardless this is a limitation of nrwl/next, it should output package.json with all the required dependencies