| 1 | # ./ |
| 2 | |
| 3 | This template should help get you started developing with Vue 3 in Vite. |
| 4 | |
| 5 | ## Recommended IDE Setup |
| 6 | |
| 7 | [VS Code](https://code.visualstudio.com/) + [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur). |
| 8 | |
| 9 | ## Recommended Browser Setup |
| 10 | |
| 11 | - Chromium-based browsers (Chrome, Edge, Brave, etc.): |
| 12 | - [Vue.js devtools](https://chromewebstore.google.com/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd) |
| 13 | - [Turn on Custom Object Formatter in Chrome DevTools](http://bit.ly/object-formatters) |
| 14 | - Firefox: |
| 15 | - [Vue.js devtools](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/) |
| 16 | - [Turn on Custom Object Formatter in Firefox DevTools](https://fxdx.dev/firefox-devtools-custom-object-formatters/) |
| 17 | |
| 18 | ## Type Support for `.vue` Imports in TS |
| 19 | |
| 20 | TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types. |
| 21 | |
| 22 | ## Customize configuration |
| 23 | |
| 24 | See [Vite Configuration Reference](https://vite.dev/config/). |
| 25 | |
| 26 | ## Project Setup |
| 27 | |
| 28 | ```sh |
| 29 | bun install |
| 30 | ``` |
| 31 | |
| 32 | ### Compile and Hot-Reload for Development |
| 33 | |
| 34 | ```sh |
| 35 | bun dev |
| 36 | ``` |
| 37 | |
| 38 | ### Type-Check, Compile and Minify for Production |
| 39 | |
| 40 | ```sh |
| 41 | bun run build |
| 42 | ``` |