Skip to content

🐛 Bug: Frontend code changes not reflected in Docker container due to incorrect dist directory #12989

@hengke

Description

@hengke

Please confirm that the bug report does not already exist

  • I confirm there is no existing issue for this bug.

Steps to reproduce

Problem Description

After modifying frontend code and building a Docker image using the provided build-local-docker-image.sh script, the changes are not reflected in the running container.

Root Cause Analysis

The issue stems from the fact that there are two different directories containing the frontend dist files in the Docker image:

  1. /usr/src/app/node_modules/nc-lib-gui/lib/dist/ - Contains old frontend build files (from npm installation)
  2. /usr/src/app/docker/nc-gui/ - Contains the newly built frontend files (from build-local-docker-image.sh script)

The application at runtime uses the files from node_modules/nc-lib-gui/lib/dist/, not from docker/nc-gui/. Therefore, even though the build script correctly copies the new frontend files to docker/nc-gui/, the application still serves the old files from node_modules.

Reproduction Steps

  1. Modify frontend code in packages/nc-gui/
  2. Run ./build-local-docker-image.sh to build Docker image
  3. Start container: docker run -d -p 3333:8080 --name nocodb-local nocodb-local
  4. Verify that frontend changes are not reflected
  5. Inspect container to confirm:
docker exec -it nocodb-local bash
ls -la /usr/src/app/docker/nc-gui/           # New files
ls -la /usr/src/app/node_modules/nc-lib-gui/lib/dist/  # Old files

Desired Behavior

Workaround

The following commands inside the container can temporarily fix the issue:

# Remove old dist directory
rm -rf /usr/src/app/node_modules/nc-lib-gui/lib/dist
 
# Create symlink to the new build directory
ln -s /usr/src/app/docker/nc-gui /usr/src/app/node_modules/nc-lib-gui/lib/dist

Suggested Fix

Modify packages/nocodb/Dockerfile.local to create a symbolic link after dependency installation. Add the following lines after the pnpm install command (around line 33):

Current code (lines 31-35):

RUN pnpm install --prod --shamefully-hoist \
    && pnpm dlx modclean --patterns="default:*" --ignore="nc-lib-gui/**,dayjs/**,express-status-monitor/**,@azure/msal-node/dist/**,@react-email/**,@linear/**,jsdom/**,formdata-polyfill/**" --run \
    && rm -rf ./node_modules/sqlite3/deps \
    && chmod +x /usr/src/appEntry/start.sh

Proposed change:

RUN pnpm install --prod --shamefully-hoist \
    && pnpm dlx modclean --patterns="default:*" --ignore="nc-lib-gui/**,dayjs/**,express-status-monitor/**,@azure/msal-node/dist/**,@react-email/**,@linear/**,jsdom/**,formdata-polyfill/**" --run \
    && rm -rf ./node_modules/sqlite3/deps \
    && chmod +x /usr/src/appEntry/start.sh \
    && rm -rf ./node_modules/nc-lib-gui/lib/dist \
    && ln -s /usr/src/app/docker/nc-gui ./node_modules/nc-lib-gui/lib/dist

Impact

This issue affects anyone trying to build a custom Docker image with frontend modifications, making it impossible to test frontend changes in Docker environment without manual intervention.

Additional Context

  1. The build-local-docker-image.sh script correctly builds and copies frontend files to packages/nocodb/docker/nc-gui/
  2. The Dockerfile correctly copies docker/nc-gui/ to the image
  3. However, the application serves frontend files from node_modules/nc-lib-gui/lib/dist/ instead
  4. Creating a symlink ensures the application always uses the latest built files from docker/nc-gui/

Project Details

  • NocoDB version: Current develop and master branch
  • Dockerfile: packages/nocodb/Dockerfile.local
  • Build script: build-local-docker-image.sh

Attachments

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions