can't use vite, serverless and vercel dev at the same time

[j4k0xb]

If I use the default config and default development command (vite) and run vercel dev:
it starts both on different ports

 vite v2.4.4 dev server running at:

  > Local: http://localhost:32951/
  > Network: use `--host` to expose

  ready in 279ms.

> Success! Build completed
> Ready! Available at http://localhost:3000

changing the command to npm run dev and the following package.json, starts both on port 3000 and serverless functions work, but the vite/vue app itself doesn't:

"scripts": {
  "dev": "vite --port $PORT",
  "build": "vue-tsc --noEmit && vite build",
  "serve": "vite preview"
},
"dependencies": {
  "vue": "^3.0.5"
},
"devDependencies": {
  "@vercel/node": "^1.11.1",
  "@vitejs/plugin-vue": "^1.3.0",
  "@vue/compiler-sfc": "^3.0.5",
  "typescript": "^4.3.2",
  "vite": "^2.4.4",
  "vue-tsc": "^0.2.2"
}

[andrewMacmurray]

I've started having the same problem too (it changed without upgrading anything which was a bit alarming).

As a workaround I have this in my vite.config.js:

  server: {
    port: 5000,
    proxy: {
      "/api": {
        target: "http://localhost:3000",
        changeOrigin: true,
        secure: false,
      },
    },
  },

And then run vite separately along with vercel dev

[cj]

@andrewMacmurray I have the same issue, but if I run vercel dev it just runs vite. Is there any other workaround?

[metruzanca]

I've also had this problem. Can't seem to run vercel on its own and vite on its own.
I don't want to use a meta-framework, I just want the vercel functions separate from the frontend. E.g. in my case I have a solidjs app and I just need 1 api function for an OAuth secret.

[nicehatharry]

fwiw, @andrewMacmurray has the solution above. I'm building my functions as fetch calls in a git-ignored api directory to test them, then replacing the fetch call with the imported function before I deploy. It's not pretty, but it's better than having to push to test everything function related.

[dhruvkb]

I have the same problem. This should be an issue instead of a discussion.

[qoomon]

Although I can't explain why, following config solve the issue for me.
package.json

{
  "scripts": {
    "dev": "vite --port $PORT",
  }
}

vercel.json

{
  "devCommand": "npm run dev"
}

[chriscodingxyz]

hey there! were you getting error after deployment of the page just saying something like: "export default "/assets/index-7fb659dc.html" ? Having a hard time deploying my site on Vercel using Vite + React

[qoomon]

I don't get your question, sorry.