0

I'm struggling to deploy my front end vite app to heroku as it seems to be looking for a start script and vite doesn't really have one.

These are logs I'm getting:

2022-08-23T23:34:35.000000+00:00 app[api]: Build succeeded
2022-08-23T23:34:35.042812+00:00 heroku[web.1]: Starting process with command `npm start`
2022-08-23T23:34:36.672295+00:00 app[web.1]: npm WARN config production Use `--omit=dev` instead.
2022-08-23T23:34:36.690924+00:00 app[web.1]: npm ERR! Missing script: "start"
2022-08-23T23:34:36.691004+00:00 app[web.1]: npm ERR!
2022-08-23T23:34:36.691142+00:00 app[web.1]: npm ERR! Did you mean one of these?
2022-08-23T23:34:36.691243+00:00 app[web.1]: npm ERR!     npm star # Mark your favorite packages
2022-08-23T23:34:36.691273+00:00 app[web.1]: npm ERR!     npm stars # View packages marked as favorites
2022-08-23T23:34:36.691308+00:00 app[web.1]: npm ERR!
2022-08-23T23:34:36.691345+00:00 app[web.1]: npm ERR! To see a list of scripts, run:
2022-08-23T23:34:36.691382+00:00 app[web.1]: npm ERR!   npm run
2022-08-23T23:34:36.692657+00:00 app[web.1]:
2022-08-23T23:34:36.692823+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2022-08-23T23:34:36.692964+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2022-08-23T23_34_36_639Z-debug-0.log
2022-08-23T23:34:36.822926+00:00 heroku[web.1]: Process exited with status 1
2022-08-23T23:34:36.901286+00:00 heroku[web.1]: State changed from starting to crashed

and that's my package.json:

{
  "name": "JJ app",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "vite": "^3.0.7",
  "scripts": {
    "dev": "vite",
    "build": "tsc && vite build",
    "preview": "vite preview"
  },
  "engines": {
    "node": "18.x"
  },
  "dependencies": {
    "@fortawesome/fontawesome-free": "^6.1.2",
    "@types/axios": "^0.14.0",
    "axios": "^0.27.2",
    "eslint-config-react-typescript": "^1.0.10",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.3.0",
    "w3-css": "^4.1.0"
  },
  "devDependencies": {
    "@types/react": "^18.0.17",
    "@types/react-dom": "^18.0.6",
    "@vitejs/plugin-react": "^2.0.1",
    "typescript": "^4.6.4"
  }
}

How should I setup my scripts to resolve the issue?

jsbrcad
  • 33
  • 1
  • 7

1 Answers1

1

Create a special file at project root named Procfile and put inside the following content:

web: vite preview --port $PORT

I don’t have experience with Heroku. I know because it is documented in Heroku help center

And of course you need to know a little bit about vite preview command.

Above links are reachable by searching “heroku deploy node” and “vite deploy”. Hopefully sharing my process would help you learn how to unstuck yourself next time. Cheers.

hackape
  • 18,643
  • 2
  • 29
  • 57