add docker compose watch and prisma studio

Dockerfile.dev

@@ -1,5 +1,7 @@
 FROM node:20-alpine
 
+RUN apk add --no-cache openssl
+
 WORKDIR /usr/src/app
 
 COPY package.json pnpm-lock.yaml ./
@@ -13,4 +15,4 @@ COPY . .
 
 EXPOSE 3000
 
-CMD ["pnpm", "dev:docker"]
+CMD ["pnpm", "dev:docker"]

docker-compose.yml

@@ -8,14 +8,40 @@ services:
     container_name: cms-docker
     environment:
       - DATABASE_URL=postgresql://postgres:postgres@db:5432/cms?schema=public
-      - NEXT_WEBPACK_USEPOLLING=1
     ports:
       - '3000:3000'
-      - '5555:5555'
     volumes:
-      # - .:/usr/src/app
       - /usr/src/app/.next
       - /usr/src/app/node_modules
+    develop:
+      watch:
+        - path: ./
+          action: sync
+          target: /usr/src/app
+          ignore:
+            - node_modules/
+            - .next/
+            - .git/
+        - path: package.json
+          action: rebuild
+        - path: pnpm-lock.yaml
+          action: rebuild
+    depends_on:
+      db:
+        condition: service_healthy
+
+  prisma-studio:
+    build:
+      context: .
+      dockerfile: Dockerfile.dev
+    container_name: prisma-studio
+    environment:
+      - DATABASE_URL=postgresql://postgres:postgres@db:5432/cms?schema=public
+    ports:
+      - "5555:5555"
+    volumes:
+      - /usr/src/app/node_modules
+    command: npx prisma studio --port 5555 --hostname 0.0.0.0
     depends_on:
       db:
         condition: service_healthy
@@ -39,4 +65,4 @@ services:
       retries: 5
 
 volumes:
-  postgres-data:
+  postgres-data:

next.config.js

@@ -21,16 +21,16 @@ const nextConfig = {
     },
   },
   swcMinify: true,
-  webpack: (config) => {
-    // Enable polling based on env variable being set
-    if (process.env.NEXT_WEBPACK_USEPOLLING) {
-      config.watchOptions = {
-        poll: 500,
-        aggregateTimeout: 300,
-      };
-    }
-    return config;
-  },
+  // webpack: (config) => {
+  //   // Enable polling based on env variable being set
+  //   if (process.env.NEXT_WEBPACK_USEPOLLING) {
+  //     config.watchOptions = {
+  //       poll: 500,
+  //       aggregateTimeout: 300,
+  //     };
+  //   }
+  //   return config;
+  // },
   output: 'standalone',
 };
 

package.json

@@ -5,6 +5,11 @@
   "prisma": {
     "seed": "ts-node --compiler-options {\"module\":\"CommonJS\"} prisma/seed.ts"
   },
+  "pnpm" : {
+    "onlyBuiltDependencies": [
+      "bcrypt"
+    ]
+  },
   "scripts": {
     "preinstall": "npx only-allow pnpm",
     "postinstall": "prisma generate",
@@ -15,8 +20,8 @@
     "lint:fix": "eslint --max-warnings 0 --config .eslintrc . --fix",
     "format:fix": "prettier --write \"**/*.{ts,tsx,json}\"",
     "format:check": "prettier --check \"**/*.{ts,tsx,json}\"",
-    "prisma:docker": "npm run prisma:migrate && npm run db:seed && npm run studio",
-    "dev:docker": "npm run prisma:docker & next dev",
+    "prisma:docker": "npm run prisma:migrate && npm run db:seed",
+    "dev:docker": "npm run prisma:docker && next dev",
     "prisma:migrate": "prisma migrate deploy",
     "db:seed": "prisma db seed",
     "db:reset": "prisma migrate reset",