javascriptvue.jsvite

What is the difference between "vite" and "vite preview"?


I created a project template using Vite.

Under package.json, I saw this:

"scripts": {
  "dev": "vite",
  "build": "vue-tsc --noEmit && vite build",
  "preview": "vite preview"
},

What's the difference between vite and vite preview? When should one use vite instead of vite preview?


Solution

  • npm run dev (or vite) starts a local web server with Hot Module Replacement for development, and will automatically change when code changes

    npm run build (or vite build) builds the project, and outputs to the folder ./dist

    npm run preview (or vite preview) start a local web server that serves the built solution from ./dist for previewing

    Beware