1001Ferramentas
Tools Categories Guides FAQ
About Contact Privacy Policy Terms of Use
▲Dev

vercel.json Generator

Create a vercel.json with routes, redirects and HTTP headers ready for your Vercel deploy. Set it all up in the browser and drop it into your repo.



  


  






    
    
    

      

        
        

          
A vercel.json sample with one catch

          
          
          

            
Shipping an Express app to Vercel is not like publishing a static site: the platform has to know which file is the serverless function and where every request should land. This page shows a vercel.json in exactly that shape, with an @vercel/node build pointing at src/app.js, a catch-all route and two basic security headers already filled in.

            
Read this before you copy. The generated file carries routes and headers at the same time, and Vercel rejects that mix with a mixed routing properties error. routes is the legacy syntax, and whenever it is present it cannot coexist with headers, redirects, rewrites, cleanUrls or trailingSlash. Treat the output as a starting point rather than a finished config ready to deploy.

            
The modern fix is to delete the routes block and express the same intent with rewrites, using source and destination, while keeping headers untouched. You can usually drop builds entirely too and let Vercel detect the project, which produces fewer surprises with a known framework. The page has no inputs: the JSON is fixed and assembled in your browser, so adjust the paths to your repository.

          

        

        
        
        
        

          
Frequently asked questions

          

            
            

              Does the generated file deploy as is?
              
Not without edits. Mixing routes with headers makes Vercel refuse the configuration; replace routes with rewrites and the deploy goes through.

            

            
            

              Do I need the builds block?
              
In most projects, no. Vercel detects the framework and runtime on its own, and builds is a version 2 leftover that turns that detection off.

            

            
            

              Can I choose the headers on the page?
              
No. You always get X-Frame-Options: DENY and X-Content-Type-Options: nosniff. Adding CSP or HSTS means editing the array after pasting.

            

            
          

        

        
      

    

    
    
    
    
    

      



  
Related Tools

  

    
      
  

    🚂
    

      
railway.toml Generator

      
Generate a railway.toml with build, start and healthcheck settings ready for your Railway deploy. Configure it in the browser and drop it in your repo.

    

  



    
      
  

    🌐
    

      
netlify.toml Generator

      
Generate a netlify.toml with build command, redirects and security headers ready for your Netlify deploy. Set it up in the browser and copy the file.

    

  



    
      
  

    🟦
    

      
tsconfig.json Generator

      
Generate a custom tsconfig.json: ES target, module, strict, paths, JSX, declaration and more. Validation against invalid options. Everything in your browser.