Why does npm run deploy not work for deploying my Vue project to gh-pages?

Question

I did everything according to all the tutorials and articles on how to deploy a Vue app to GitHub, but when I run npm run deploy, I keep getting this error: error: src refspec main does not match any, and all the articles I could find online are about this issue being caused for the master branch, and the solutions are all to just create a main branch, but I do have a main branch, and I do have it on my remote too.

Why do I keep getting this error? I have a vue.config.js file, and inside, I have this:

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true
})

module.exports = {
  publicPath: process.env.NODE_ENV === 'production'
  ? '/todo-list/'
  : '/'
}

The first part was there by default when the app was created, so I haven't removed it.

I also have a deploy.sh file, and in it, I have this:

#!/usr/bin/env sh
# abort on errors
set -e
# build
npm run build
# navigate into the build output directory
cd dist
# if you are deploying to a custom domain
# echo 'www.example.com' > CNAME
git init
git add -A
git commit -m 'deploy'
git push -f git@github.com:myname/todo-list.git main:gh-pages
cd -

The only thing I don't have is gh-pages branch, but that's because:

1. I though this file is supposed to create one automatically for me with the files from the /dist folder.
2. If I create one from the main branch, it will just contain all the files from main, and as far as I know, that's not supposed to happen, because the gh-pages is supposed to contain only the build for production files.

What am I doing wrong?