Avoiding node_modules in final build

[RicardoGaefke]

❓Question

First of all, thank you very much for your amazing work. I'm using razzle within an ASP.NET Core 5 (Jering.Javascript.NodeJS for ssr) app and it works pretty fine but there is something that I'd like to improve. Using Docker I need to copy node_modules to my final layer which makes it really bigger. This is my dockerfile:

# clones the app
FROM alpine AS gitclone
ARG BRANCH
ARG GIT_CRED

RUN apk update && apk add --no-cache git

RUN mkdir /root/app/
RUN git clone -b ${BRANCH} https://${GIT_CRED}@dev.azure.com/myCompany/myRepo/_git/any ./app

# builds the app
FROM mcr.microsoft.com/dotnet/sdk:5.0-alpine3.12 AS build

RUN apk update && apk add --no-cache nodejs npm

COPY --from=gitclone /app ./app

WORKDIR /app/src/WebSite

RUN dotnet publish -c Release ./WebSite.csproj -r linux-musl-x64 -o ./publish

# runs the app
FROM mcr.microsoft.com/dotnet/aspnet:5.0.4-alpine3.12 as runtime

RUN apk update && apk add --no-cache nodejs npm

RUN export PATH=$PATH:/usr/bin/node:/usr/share/doc/nodejs

ENV ASPNETCORE_URLS=http://+:5000

COPY --from=build /app/src/WebSite/publish ./
COPY --from=build /app/src/WebSite/ClientApp/node_modules ./node_modules
COPY --from=build /app/src/WebSite/ClientApp/build ./ClientApp/build

ENTRYPOINT ["./WebSite"]

The app wasn't working before copying the node_modules and I found this in your docs:

Is there a way to build server bundle to avoid copying node_modules?

Thank you very much.

[fivethreeo]

You can do it like this https://github.com/fivethreeo/razzle-with-docker-nginx/blob/master/Dockerfile

or bundle everything with buildType iso-serverless in razzle options

[fivethreeo]

also, use buildkit for faster docker builds

[RicardoGaefke]

Thank you very much... buildType: 'iso-serverless' worked pretty fine. I'll take a look into buildkit.

[RicardoGaefke]

Sorry, it was my mistake. Using buildType: 'iso-serverless' didn't work for me and this is the message:

I'll keep copying the node_modules for now and I'll look for something to improve image size (without node_modules is half size).

[fivethreeo]

I think this may have to do with loadable-components and react being a lazy require. Think you may need webpack contextplugin to make sure react is required directly on serverside. In react 18 we can stop using loadable-components.

[fivethreeo]

If using express

https://github.com/jaredpalmer/razzle/tree/master/examples/basic-serverless

[fivethreeo]

Make sure react is imported in the server entrypoint so it is not dynamically imported

[fivethreeo]

Use https://github.com/jaredpalmer/razzle/tree/master/examples/with-development-build , to inspect what server.js does by reading built server.js source

[dmitryshelomanov]

@fivethreeo not working for me

too many errors like this

./node_modules/react-router-dom/server.mjs 72:18-37
Can't import the named export 'createElement' from non EcmaScript module (only default export is available)

how to build server with node modules ?

[fivethreeo]

https://razzlejs.org/docs/customization#transpilation-of-external-modules