Fixes Docker filesystem mounting

Dockerfile.wordpress

@@ -0,0 +1,28 @@
+FROM node:18 as builder
+
+# Build the Gutenberg blocks
+WORKDIR /app
+COPY src/documentcloud/blocks/package*.json ./
+RUN npm ci --legacy-peer-deps
+
+# Copy the entire documentcloud directory to get proper paths
+COPY src/documentcloud ./
+# Set working directory to blocks for the build
+WORKDIR /app/blocks
+RUN npm run build
+
+FROM wordpress:latest
+
+# Copy WordPress files (to override default ones if needed)
+COPY src/wordpress /var/www/html/
+
+# Copy DocumentCloud plugin files
+COPY src/documentcloud /var/www/html/wp-content/plugins/documentcloud/
+
+# Copy built assets from builder stage
+COPY --from=builder /app/blocks/build /var/www/html/wp-content/plugins/documentcloud/blocks/build/
+
+# Set proper ownership and permissions
+RUN chown -R www-data:www-data /var/www/html/ && \
+    find /var/www/html/wp-content/plugins/documentcloud/ -type d -exec chmod 755 {} \; && \
+    find /var/www/html/wp-content/plugins/documentcloud/ -type f -exec chmod 644 {} \;

README.md

@@ -111,26 +111,66 @@ If you find yourself absolutely needing to expire the cache, though, you have tw
 
 ## Development
 
-Plugin files are located in `src/documentcloud`
+Plugin files are located in `src/documentcloud` and WordPress core files in `src/wordpress`.
 
-Docker is used to spin up a development and testing WordPress environment.
+Docker is used to spin up a development WordPress environment using a **build-based approach**. Files are copied into the container during build time, providing complete isolation between local development and the running container.
 
 Unit tests are setup using PHPUnit and Jest, please refer to [Testing Setup ](./TESTING.md) for the setup steps
 
 ### Install
 
 ```sh
-# Start services
-docker compose up
-
-# Fix permissions
-docker compose exec wordpress chown -R www-data:www-data /var/www/html
+# Build and start services
+docker compose build wordpress
+docker compose up -d
 ```
 
 1. Go to [`localhost:8000`](http://localhost:8000)
 2. Create an account. Save the username and password, then log in.
 3. Go to the Plugins section, then activate the "DocumentCloud" plugin.
 
+### Making Changes During Development
+
+**Important:** This setup uses a build-based approach instead of volume mounts for complete isolation and reproducible builds.
+
+#### Fast Development Workflow (Recommended)
+
+Use Docker Compose's built-in watch mode for automatic file syncing:
+
+```sh
+# Start services with watch mode enabled
+docker compose watch
+
+# Or run in background
+docker compose up -d && docker compose watch
+```
+
+- **PHP files** are synced instantly to the container (no rebuild needed)
+- **JavaScript/Block changes** trigger an automatic rebuild with the new assets
+
+The watch configuration automatically:
+- Syncs plugin PHP files and assets in real-time
+- Rebuilds when `blocks/src/` or `package.json` changes
+- Ignores changes to `node_modules/` and build artifacts
+- Handles file permissions correctly
+
+#### Full Container Rebuild
+
+For major changes or when syncing isn't sufficient, rebuild the container:
+
+```sh
+# Rebuild and restart
+docker compose down
+docker compose build wordpress
+docker compose up -d
+```
+
+### File Structure
+- `src/documentcloud/` - DocumentCloud plugin source files
+- `src/wordpress/` - WordPress core files (copied to container during build)
+- `Dockerfile.wordpress` - Multi-stage build that compiles blocks and copies all files
+- `docker-compose.yml` - No volume mounts, uses custom built image
+
 ### Test
 
 Tests can be run in a separate container called `testing`.

docker-compose.yml

@@ -1,7 +1,9 @@
 services:
   wordpress:
     restart: always
-    image: wordpress:latest
+    build:
+      context: .
+      dockerfile: Dockerfile.wordpress
     container_name: wordpress
     ports:
       - "8000:80"
@@ -11,10 +13,24 @@ services:
       WORDPRESS_DB_PASSWORD: password
       WORDPRESS_DB_NAME: wordpress
       WORDPRESS_TABLE_PREFIX: wp_
-    volumes:
-      - ./src/wordpress:/var/www/html
-      - ./src/documentcloud:/var/www/html/wp-content/plugins/documentcloud
-
+    develop:
+      watch:
+        # Sync plugin PHP files and assets (excluding blocks source)
+        - action: sync
+          path: ./src/documentcloud
+          target: /var/www/html/wp-content/plugins/documentcloud
+          ignore:
+            - blocks/node_modules/
+            - blocks/src/
+            - blocks/package.json
+            - blocks/package-lock.json
+        # Rebuild when JavaScript source or dependencies change
+        - action: rebuild
+          path: ./src/documentcloud/blocks/src
+        - action: rebuild
+          path: ./src/documentcloud/blocks/package.json
+        - action: rebuild
+          path: ./src/documentcloud/blocks/package-lock.json
     depends_on:
       - db
     networks: