DEV Community

How to deploy a Python/Flask App to Vercel

Andrew Baisden on September 17, 2020

This is just a quick simple example of course more complex applications will work as well. Prerequisites Step 1 Create an account with...

Read full post

Josias Aurel • Oct 7 '20

Hi. It didn't work for me . It's says bad gateway. Here is the link : pyvercel.vercel.app/

Andrew Baisden • Oct 7 '20

Hey I just followed the tutorial I wrote it worked for me. What is your operating system I am using macOS. It should work fine for macOS and Windows however Linux might have some issues because it is not covered in the documentation.

Josias Aurel • Oct 7 '20

I am using a terminal emulator Termux which emulates Linux pretty well. I don't know if that's the problem. I'll retry

brandon flowers • Oct 7 '20 • Edited

I'm also interested in this demo. Big thank you Andrew for writing it up!

I too was able to get your demo running locally but when I deployed it to Vercel - I also the got the bad gateway error! It deployed successfully and I can see in my builds logs that it looks good.

In the past, I have been able to deploy a Flask app to Vercel though so I'm troubleshooting too to see if I can see what has changed.

I'm on a Mac and share same environment as Andrew. I'll try to find what's going on and report back.

brandon flowers • Oct 7 '20

Just a follow up.... in my case, I forgot to include the requirements.txt file.

Once I added the requirements, I was able to deploy the app:

venv.headwinds1.vercel.app/

Josias Aurel • Oct 7 '20

I don't know what's happening really. I rebuilt the app three times and nothing. I'll retry one more time ;/

brandon flowers • Oct 7 '20

rebuilt eh?

Can you run the app locally in your browser?

Josias Aurel • Oct 7 '20

Yeah. It works correctly locally

brandon flowers • Oct 7 '20

I've pushed my source to github

github.com/headwinds/venv

Josias Aurel • Oct 7 '20

Thanks. I'll check it

Andrew Baisden • Oct 7 '20

Yeah that requirements.txt file is essential without it the routing is broken. As for the problems Josias is having its likely because its Linux and because you are using Termux on Android I think. I don't have any experience with that setup my guess is its something to do with the paths similar to the issues that max had.

brandon flowers • Oct 7 '20

github.com/headwinds/venv

clone git@github.com:headwinds/venv.git
cd venv/venv
vercel

Josias Aurel • Oct 7 '20

Well Andrew you are probably right. Even when I cloned your repo it didn't work for as well. That's probably something with Termux. I am giving up on using only termux and I'll try another way . Thanks guys

Josias Aurel • Oct 7 '20 • Edited

Hey. I gave myself a last try but this time I took away the virtual env. This means that the problem came from he fact that the virtual env replicated my architecture (aarch64) which is not compatible with vercel. I redeployed only with the main server, requirements.txt and the vercel.json config. Here is the basic server running and the
repo

Andrew Baisden • Oct 7 '20

Well done you worked hard to find a solution congrats!

Josias Aurel • Oct 8 '20

Thanks. I am happy it works now

brandon flowers • Oct 8 '20

amazing - very happy to hear and also great that you shared your solution for others!

maxdevjs • Sep 18 '20

Hello, thank you for this tutorial.

Locally, if I do an export FLASK_APP=index.py I get a 127.0.0.1 - - [18/Sep/2020 08:24:15] "GET / HTTP/1.1" 500 terminal message and a flask.cli.NoAppException: Could not import "index". browser message.

Works correctly for routes with an export FLASK_APP=/absolute/path/to/index.py, but again I get a FileNotFoundError: [Errno 2] No such file or directory: './data.json'. If I use an absolute path also for the data.json file, it works (locally, but, obviously, breaks the api route when deployed).

flask --version
Python 3.7.7
Flask 1.1.2
Werkzeug 1.0.1

Your version works perfectly when deployed to Vercel.

Any idea about those local paths?

P.S.: Vercel build log reports Warning: Due tobuildsexisting in your configuration file, the Build and Development Settings defined in your Project Settings will not apply. Is that right?

Andrew Baisden • Sep 18 '20 • Edited

Hi what operating system and code editor are you using? Check out the official docs here they might help flask.palletsprojects.com/en/1.1.x...

So about the build logs I just did a test. If you remove this code below from the vercel.json file then that log goes away however the routing will not work so it is needed. It's probably just a note and not a serious warning. And you can use the command vercel --prod for production deployments that will get rid of the production log note too I updated the guide to reflect this.

    "builds": [
        {
            "src": "./index.py",
            "use": "@vercel/python"
        }
    ],

maxdevjs • Sep 18 '20 • Edited

Thank for the reply.

I use nvim on Solus.

I did not find anything really useful in the documentation about this case, probably because it is the first time I meet Flask :)

As a temporary solution I got this:

import os

with open(
            os.path.join(
            os.path.dirname(
            os.path.abspath(__file__)),
            'data.json')) as file:

I guess is not an optimal solution, but things like this are the only way that I found so far to make it work (don't mind the indentation). Quickly tested and works on Vercel too.

It seems related to how open behaves in Flask (perhaps the version I do have?). I am really curious about what can be the cause.

Andrew Baisden • Sep 18 '20

Ah ok that explains it. So Solus is a version of Linux? The Flask documentation only mentions Mac and Windows in the documentation as far as I can see. However you seem to have figured out how to get it working. I am sure you will figure it out as you have experience working with Solus which I have never used before.

maxdevjs • Sep 18 '20

Yes, it is a Linux flavor. Thank you again for the tutorial :)

brandon flowers • Oct 7 '20

I know there are devs at Vercel who are very passionate about Python but - from an outsider's perspective - it appears that they are focussing on marketing & promoting more Node-related hosting like NextJS or Gatsby over other languages - there used to be more tutorials for Go and Python but they all seem to be javascript today:

vercel.com/docs

But where is the Python Flask quick start?! Well...right here.

Andrew Baisden • Oct 7 '20

Javascript seems to have far more popularity because there are so many frameworks available and it is one of the core technologies of the web. I'm not sure there is even an official tag for Flask on here I know there is one for Django.

I think a lot of people prefer to use Python for scripting, scraping and machine learning as opposed to web development first and foremost.

Jakub Rudnik • Sep 23 '21

You are using flask==2.0.1? Unfortunately vercel don't support it (I think so, I'm not vercel dev).
Quick fix:
requirements.txt

flask==1.1.4

vercel.json

{
  "version": 2,
  "builds": [
    {
      "src": "./index.py",
      "use": "@vercel/python"
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "index.py"
    }
  ]
}

whiterock • Sep 27 '21

Thank you so much for this! I specifically signed up to this website for the sole reason to thank you - this information cannot be found anywhere else and I struggled with Flask 2.0.1 and vercel for hours today.

Anas Basheer • Dec 31 '23

Hi. I know this is an old post, but there are still people who are following this tutorial I believe just like me. But as of the latest update in the vercel.json file, the "version": 2" should not be used anymore. For more details you can refer to vercel.com/docs/projects/project-c....

I hope you can update the existing code you provided and it will help others in the future, because I followed your tutorial and got completely stuck and was trying to figure out what was going wrong, the deployment always resulted in 404: NOT FOUND, and I was so confused.

Roger Camargo • Jul 26 '21

Hi everyone!
It did work, however, I'd suggest few changes to make this post simpler:

Create the virtualenv first, preferably outside the project (instead of venv inside vercel-python-app, use ~/.venv/vercel for example)
active our virtualenv and install Flask
create the vercel-python-app folder, the index.py and the data.json
make sure it is working locally
create the requirements.txt and vercel.json inside the project folder (vercel-python-app)
lastly, inside the vercel-python-app (instead of venv folder), run the vercel command. In this way the deploy will work at first! It won't send all the site-packages, you won't need to duplicate the files

In another word, in this way, you can use the default python/flask structure. Just adding the vercel.json and running the vercel cmd, you make the deploy. Awesome!

Nathanpamart • Feb 10 '23

Hi Andrew, just followed your post and it worked well for me. One question, I am trying to a build an app with next.js for the frontend and flask as the backend, within the same project on Vercel. How would you suggest setting this up?

Andrew Baisden • Mar 1 '23

Hey I hope you found a solution sorry about the slow response I have a LOT of messages to check these days.

Osman • Sep 18 '23

i know i am absolutely late for the topic.but i gotta ask something..looked up everywhere to find a project that contains more than 1 python files deployed on vercel.in addition to app.py,i have 2 more classes with functions.deployment was an issue so i merged them all in app.py.want to set it up properly now.how should i write my vercel.json file? tried many things but could not manage to deploy.

Anas Basheer • Dec 31 '23

Hi there, has it been resolved yet?

When you say more than 1 python file, you mean that you have more than 2 flask app files? It is possible, but there should always be one main module which imports all the other files, and that is the one you should include the vercel.json file.

Osman • Sep 19 '23

I am importing the other files from "app.py" and the error i get is "module not found".

Lee Robinson • Dec 2 '22

Hey there! Thank you for writing this.

We now have a one-click deployable Flask example included in our documentation, as well as Django and a simple Python API.

SebasEC • Feb 14 '21 • Edited

Hi, i can't make it work. The deployment is successful but when i try to load the page it says 404: NOT_FOUND. Locally it works fine, i'm using wsl.

SebasEC • Feb 16 '21

Solution

{
    "version": 2,
    "builds": [
        {
            "src": "./index.py",
            "use": "@vercel/python"
        }
    ],
    "routes": [
        {
            "src": "/(.*)",
            "dest": "index.py"
        }
    ]
}

adam_lala • Jan 1 '22 • Edited

Update as of 1/1/2022

I used a vercel.json file with:

{
    "version": 2,
    "builds": [
        {
            "src": "index.py",
            "use": "@vercel/python"
        }
    ],
    "routes": [
        {
            "src": "/(.*)",
            "dest": "index.py"
        }
    ]
}

Changing the src from ./index.py to index.py got rid of an error message:

WARN! You defined 1 build that did not match any source files (please ensure they are NOT defined in .vercelignore):

Andrew Baisden • Feb 15 '21

Hey does wsl mean Windows Subsystem for Linux? If so that is likely why it is not working. I don't think this method works well on Linux see the comments. It's probably better to use lambda.

tesaabi • Apr 15

Hii, i've followed all the steps but still got this on the web

404: NOT_FOUND
Code: NOT_FOUND

tesaabi • Apr 15

this is the link
obesitas-929mzvo5j-tesalonika-abig...

tesaabi • Apr 15

update ^ the link above is not it

im using flas 2.2.3 cant it work with that version because when i try to deploy/ prod it gives me this "Error: Unable to find any supported Python versions." error

John Njuki • Dec 12 '22

So helpful. Thanks

GNVageesh • Oct 15 '21

What command should we run after making an update to the project? And thanks for this tutorial

Kindly let me

tzllol • Dec 17 '20

i have seen in some youtube video the get the domain like "example.now.sh" how do i do it?

Andrew Baisden • Dec 17 '20

So they used to be called Zeit Now and then they rebranded to Vercel. I believe the old domains were "now.sh" and the new domains are "vercel.app".

Piero Salazar Ascencio • Oct 24 '22

Hello, I have a app web deployed in vercel but when i add a library notify or plyer for web notifications my deploy not load. Maybe a suggestion plse?

Andrew Baisden • Oct 24 '22

Hi I am going to archive this article because Vercel have changed their API and this code does not work as well anymore. They advise people to use Serverless Functions.