CD
Cloudflare Developers•6mo ago
lavirox

build failing for html/css build/deploy using github for workers

i have a simple html/css site im trying to deploy, but the build keeps failing and i only see the default "hello world". i have linked to my github repo, and it seemed that when building it was having trouble finding the index.html so i edited the deploy command to npx wrangler deploy ./index.html. but i still have the error and the build is failing: 
Success: Finished initializing build environment
14:26:21.460    Cloning repository...
14:26:23.103    Detected the following tools from environment: 
14:26:23.106    Executing user deploy command: npx wrangler deploy ./index.html
14:26:25.531    npm warn exec The following package was not found and will be installed: wrangler@4.20.0
14:26:37.514    
14:26:37.514     ⛅️ wrangler 4.20.0
14:26:37.514    ───────────────────
14:26:37.538    
14:26:37.619    ✘ [ERROR] Build failed with 1 error:
14:26:37.619    
14:26:37.620      ✘ [ERROR] No loader is configured for ".html" files: index.html
14:26:37.620      
14:26:37.620      
14:26:37.620    
14:26:37.620    
14:26:37.620    
14:26:37.638    :wood:  Logs were written to "/opt/buildhome/.config/.wrangler/logs/wrangler-2025-06-14_21-26-36_691.log"
14:26:37.827    Failed: error occurred while running deploy command
Success: Finished initializing build environment
14:26:21.460    Cloning repository...
14:26:23.103    Detected the following tools from environment: 
14:26:23.106    Executing user deploy command: npx wrangler deploy ./index.html
14:26:25.531    npm warn exec The following package was not found and will be installed: wrangler@4.20.0
14:26:37.514    
14:26:37.514     ⛅️ wrangler 4.20.0
14:26:37.514    ───────────────────
14:26:37.538    
14:26:37.619    ✘ [ERROR] Build failed with 1 error:
14:26:37.619    
14:26:37.620      ✘ [ERROR] No loader is configured for ".html" files: index.html
14:26:37.620      
14:26:37.620      
14:26:37.620    
14:26:37.620    
14:26:37.620    
14:26:37.638    :wood:  Logs were written to "/opt/buildhome/.config/.wrangler/logs/wrangler-2025-06-14_21-26-36_691.log"
14:26:37.827    Failed: error occurred while running deploy command
1 Reply
lavirox
laviroxOP•6mo ago
update: i think workers needs a wrangler.json so i made it 
{
    "name": "site-name",
    "compatibility_date": "2025-06-14", 
    "main": "worker.js"
  }
{
    "name": "site-name",
    "compatibility_date": "2025-06-14", 
    "main": "worker.js"
  }
and i made a worker.js file: 
export default {
    async fetch(request) {
      const url = new URL(request.url);
      const path = url.pathname;
      
      const GITHUB_USER = "user";
      const GITHUB_REPO = "repo";
      const GITHUB_BRANCH = "main";
      
      try {
        let filePath;
        
        if (path === '/' || path === '') {
          filePath = 'index.html';
        } else if (path.startsWith('/')) {
          filePath = path.substring(1);
        } else {
          filePath = path;
        }
        
        const githubUrl = `https://raw.githubusercontent.com/${GITHUB_USER}/${GITHUB_REPO}/${GITHUB_BRANCH}/${filePath}`;
        const response = await fetch(githubUrl);
        
        if (!response.ok) {
          return new Response('File not found', { status: 404 });
        }
        
        const content = await response.text();
        
        const contentType = getContentType(filePath);
        
        return new Response(content, {
          headers: {
            'Content-Type': contentType,
            'Cache-Control': 'public, max-age=300'
          }
        });
        
      } catch (error) {
        return new Response('Error loading file: ' + error.message, { status: 500 });
      }
    }
  };
  
  function getContentType(filePath) {
    const extension = filePath.split('.').pop().toLowerCase();
    
    const contentTypes = {
      'html': 'text/html',
      'css': 'text/css',
      'js': 'application/javascript',
      'json': 'application/json',
      'png': 'image/png',
      'jpg': 'image/jpeg',
      'jpeg': 'image/jpeg',
      'gif': 'image/gif',
      'svg': 'image/svg+xml',
      'ico': 'image/x-icon',
      'txt': 'text/plain'
    };
    
    return contentTypes[extension] || 'text/plain';
  }
export default {
    async fetch(request) {
      const url = new URL(request.url);
      const path = url.pathname;
      
      const GITHUB_USER = "user";
      const GITHUB_REPO = "repo";
      const GITHUB_BRANCH = "main";
      
      try {
        let filePath;
        
        if (path === '/' || path === '') {
          filePath = 'index.html';
        } else if (path.startsWith('/')) {
          filePath = path.substring(1);
        } else {
          filePath = path;
        }
        
        const githubUrl = `https://raw.githubusercontent.com/${GITHUB_USER}/${GITHUB_REPO}/${GITHUB_BRANCH}/${filePath}`;
        const response = await fetch(githubUrl);
        
        if (!response.ok) {
          return new Response('File not found', { status: 404 });
        }
        
        const content = await response.text();
        
        const contentType = getContentType(filePath);
        
        return new Response(content, {
          headers: {
            'Content-Type': contentType,
            'Cache-Control': 'public, max-age=300'
          }
        });
        
      } catch (error) {
        return new Response('Error loading file: ' + error.message, { status: 500 });
      }
    }
  };
  
  function getContentType(filePath) {
    const extension = filePath.split('.').pop().toLowerCase();
    
    const contentTypes = {
      'html': 'text/html',
      'css': 'text/css',
      'js': 'application/javascript',
      'json': 'application/json',
      'png': 'image/png',
      'jpg': 'image/jpeg',
      'jpeg': 'image/jpeg',
      'gif': 'image/gif',
      'svg': 'image/svg+xml',
      'ico': 'image/x-icon',
      'txt': 'text/plain'
    };
    
    return contentTypes[extension] || 'text/plain';
  }
after doing this, my build was successful, but now when i visit the website it says File not found

Did you find this page helpful?