Inject Font Awesome token as build secret to .npmrc via Dockerfile from GitHub secrets

Question

We currently use the Font Awesome library for fonts and icons in our application. It's registered inside the the .npmrc file as below:

@fortawesome:registry=https://npm.fontawesome.com/ 
//npm.fontawesome.com/:_authToken=${FONT_AWESOME_TOKEN}

Our goal is to retrieve the FONT_AWESOME_TOKEN from GitHub secrets for security purposes and inject into the Dockerfile.

As of today, a Docker image of the solution is created using a Dockerfile like mentioned below:

# base node image
FROM node:16-bullseye-slim as base

# set for base and all layer that inherit from it
ENV NODE_ENV production

# Install all node_modules, including dev dependencies
FROM base as deps

EXPOSE 3010

ADD package.json package-lock.json .npmrc ./

RUN npm install --mount=type=secret,id=npmrc,target=/root/.npmrc

We use GitHub Actions for CI/CD purposes and Docker image that is created above using the Dockerfile is passed into the build process that is deployed to Azure container registry.

      - name: ' Build and push :latest + :tag (if "releaseToDev-")'
        run: |
            az acr login --name testdevacr  # DEV ACR
            az acr build --secret-build-arg --secret-build-arg 
            FONT_AWESOME_TOKEN=${{ secrets.FONT_AWESOME_TOKEN }} -t test-web-app:latest -t test-web- 
            app:${{steps.tag-result.outputs.result}} -r testdevacr -f Dockerfile .

The issue is that the npm build inside GitHub Actions fails with the following error message:

Step 8/22 : RUN npm install -g [email protected] --mount=type=secret,id=npmrc,target=/root/.npmrc
 ---> Running in d6d81255b755
npm WARN deprecated @npmcli/[email protected]: This functionality has been moved to @npmcli/fs

npm notice 
npm notice New major version of npm available! 8.19.4 -> 10.2.0
npm notice Changelog: <https://github.com/npm/cli/releases/tag/v10.2.0>
npm notice Run `npm install -g [email protected]` to update!
npm notice 
npm ERR! code E401
npm ERR! Unable to authenticate, your authentication token seems to be invalid.
npm ERR! To correct this please trying logging in again with:
npm ERR!     npm login

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2023-10-04T07_23_59_609Z-debug-0.log
The command '/bin/sh -c npm install --mount=type=secret,id=npmrc,target=/root/.npmrc' returned a non-zero code: 1
2023/10/04 07:24:37 Container failed during run: build. No retries remaining.
failed to run step ID: build: exit status 1

Any tips on how to pass the Font Awesome token in a way it is recognized?

Answer 1

We could finally solve this with the use of ARG

We edited the Acr.yml file command by adding a --secret-build-arg variable as below.

az acr build --secret-build-arg FONT_AWESOME_TOKEN=${{ secrets.FONT_AWESOME_TOKEN }} -t test-web-app:latest -t test-web- 
app:${{steps.tag-result.outputs.result}} -r testdevacr -f Dockerfile .

Once we defined the variables inside the Dockerfile

ARG AZURE_ARTIFACTS_TOKEN
ARG FONT_AWESOME_TOKEN

it could be easily read and recognised and worked like a charm