fixes

Dockerfile

@@ -6,7 +6,7 @@ WORKDIR /app
 COPY package*.json ./
 
 # Install dependencies
-RUN npm ci
+RUN npm install
 
 # Copy source code
 COPY . .

package.json

@@ -34,6 +34,9 @@
   "engines": {
     "node": ">=16.0.0"
   },
+  "dependencies": {
+    "gif.js": "^0.2.0"
+  },
   "devDependencies": {
     "typescript": "^5.0.0",
     "vite": "^4.0.0"

src/gif.d.ts

@@ -0,0 +1,24 @@
+declare module 'gif.js' {
+    interface GIFOptions {
+        workers?: number;
+        quality?: number;
+        width?: number;
+        height?: number;
+        transparent?: string;
+        background?: string;
+        dither?: boolean;
+        debug?: boolean;
+        repeat?: number;
+        workerScript?: string;
+    }
+
+    class GIF {
+        constructor(options?: GIFOptions);
+        addFrame(canvas: HTMLCanvasElement, options?: { delay?: number; copy?: boolean; }): void;
+        render(): void;
+        on(event: 'finished', callback: (blob: Blob) => void): void;
+        on(event: 'progress', callback: (progress: number) => void): void;
+    }
+
+    export default GIF;
+}

src/main.ts

@@ -299,14 +299,13 @@ class BitfielderApp {
 
         try {
             // Import GIF.js dynamically
-            const { default: GIF } = await import('https://cdn.skypack.dev/gif.js@0.2.0');
+            const { default: GIF } = await import('gif.js');
             
             const gif = new GIF({
                 workers: 2,
                 quality: 10,
                 width: this.canvas.width,
-                height: this.canvas.height,
-                workerScript: 'https://cdn.skypack.dev/gif.js@0.2.0/dist/gif.worker.js'
+                height: this.canvas.height
             });
 
             const frameDuration = 1000 / 30; // 30 FPS