Loading Payload in a Docker Container

joecaraccio

last year

1 3

  # Payload CMS Container
  payloadcms:
    container_name: 'payloadcms_container'
    build: ./backend/payloadcms/.
    volumes:
      - ./backend/payloadcms:/app
      - /app/node_modules/
    ports:
      - 3005:3005
    expose:
      - "3005"
    depends_on:
      - "mongodb"
    external_links:
      - "mongodb"

• Selected Answer
  

  denolfe

  Payload Team

  11 months ago

  The latest version of create-payload-app will create a docker-compose file that is ready to use for development 🎉

  Here is what it looks like if you're wanting to adapt it to an existing project:

  version: '3'
  
  services:
  
    payload:
      image: node:18-alpine
      ports:
        - "3000:3000"
      volumes:
        - .:/home/node/app
        - node_modules:/home/node/app/node_modules
      working_dir: /home/node/app/
      command: sh -c "yarn install && yarn dev"
      depends_on:
        - mongo
      environment:
        MONGODB_URI: mongodb://mongo:27017/payload
        PORT: 3000
        NODE_ENV: development
        PAYLOAD_SECRET: TESTING
  
    mongo:
      image: mongo:latest
      ports:
        - "27017:27017"
      command:
        - --storageEngine=wiredTiger
      volumes:
        - data:/data/db
      logging:
        driver: none
  
  volumes:
    data:
    node_modules:
  

• 

  jmikrut

  Payload Team

  last year

  Hey @joecaraccio — generally this error is caused by a React app having two copies of React somehow. Most often it's seen with npm link situations.

  Do you have any custom Payload React components?

  Can you think of why you might have two copies of React installed?

  That's where I'd start.

  Also, I'm not as familiar with Docker + Node (always just run Node apps locally) but the way you're configuring your node_modules within your container may have something to do with it. Maybe someone else could chime in there and / or get an example Docker container up and running for you to look at.

  1 reply
  

  joecaraccio

  last year

  Hmm can't see how that's the case. The docker container comes up, runs npm install on the payload package (which was just the template) and then launches.

  I'm sure there is something simple here that I am missing.. I just can't figure out what. Anyone here every time payload in a docker container?

• 

  donstephan

  last year

  Here's a functional compose file I have set up for local dev with payload:

  version: '3'
  
  services:
  
    # payload
    payload:
      image: node:14-alpine
      ports:
        - "3000:3000"
      volumes:
        - ./payload:/payload
        - ./payload/node_modules:/payload/node_modules
      working_dir: /payload
      command: sh -c "npm install && npm run dev"
      depends_on:
        - mongo
      environment:
        MONGODB_URI: mongodb://mongo:27017/payload
        PORT: 3000
        NODE_ENV: development
        PAYLOAD_SECRET: TESTING
  
    # mongo
    mongo:
      image: mongo:latest
      ports:
        - "27017:27017"
      command:
        - --storageEngine=wiredTiger
      volumes:
        - data:/data/db
      logging:
        driver: none
    
  volumes:
    data:
  

  6 replies
  

  DanRibbens

  Payload Team

  last year

  I just tweaked your docker-compose.yml to work with a new create-payload-app setup. Thanks for sharing!

  version: '3'
  
  services:
  
    # payload
    payload:
      image: node:14-alpine
      ports:
        - "3000:3000"
      volumes:
        - .:/home/node/app
        - node_modules:/home/node/app/node_modules
      working_dir: /home/node/app/
      command: sh -c "npm install && npm run dev"
      depends_on:
        - mongo
      environment:
        MONGODB_URI: mongodb://mongo:27017/payload
        PORT: 3000
        NODE_ENV: development
        PAYLOAD_SECRET: TESTING
  
    # mongo
    mongo:
      image: mongo:latest
      ports:
        - "27017:27017"
      command:
        - --storageEngine=wiredTiger
      volumes:
        - data:/data/db
      logging:
        driver: none
    
  volumes:
    data:
    node_modules:

  

  joecaraccio

  last year

  @donstephan Thanks for this! Just out of curiosity, does live reloading work for you in these containers?

  

  joecaraccio

  last year

  ah I guess Nodedemon can be a little finicky over docker. You gotta use legacy watch.. heres the command I used which works

  nodemon --legacy-watch --exec node server.js

  

  jmikrut

  Payload Team

  last year

  Good stuff everyone. For my own knowledge, what's the reason you'd want to build with Docker locally? To be able to dodge having to have Mongo installed? Just curiosity is all!

  

  donstephan

  last year

  Main focus for me is that it's an expected environment. No matter what machine it's running on, it'll always be running the same version of node, npm, mongo, on the same base image. This also keeps all development environments the same as production environments. No weird gotchas because someones using a different version of node/mongo.

  Plus it makes it a lot easier to add other services as well. The Payload compose file I'm playing around with also stands up a nextjs frontend as well as redis for a caching layer. It now just takes one command, docker-compose up to stand up all the services in question. The flexibility it provides is fantastic.

  

  alexbechmann

  last year

  @donstephan You might want to consider VSCode Dev containers

  • https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers
  • https://code.visualstudio.com/docs/remote/create-dev-container#_use-docker-compose

  We use this to run payload with mongodb & blob storage images added to the .devcontainer/docker-compose.yml which run when you open the project.