|
1 | | -# spriggles |
| 1 | +# Vuetify (Default) |
| 2 | + |
| 3 | +This is the official scaffolding tool for Vuetify, designed to give you a head start in building your new Vuetify application. It sets up a base template with all the necessary configurations and standard directory structure, enabling you to begin development without the hassle of setting up the project from scratch. |
| 4 | + |
| 5 | +## ❗️ Important Links |
| 6 | + |
| 7 | +- 📄 [Docs](https://vuetifyjs.com/) |
| 8 | +- 🚨 [Issues](https://issues.vuetifyjs.com/) |
| 9 | +- 🏬 [Store](https://store.vuetifyjs.com/) |
| 10 | +- 🎮 [Playground](https://play.vuetifyjs.com/) |
| 11 | +- 💬 [Discord](https://community.vuetifyjs.com) |
| 12 | + |
| 13 | +## 💿 Install |
| 14 | + |
| 15 | +Set up your project using your preferred package manager. Use the corresponding command to install the dependencies: |
| 16 | + |
| 17 | +| Package Manager | Command | |
| 18 | +|---------------------------------------------------------------|----------------| |
| 19 | +| [yarn](https://yarnpkg.com/getting-started) | `yarn install` | |
| 20 | +| [npm](https://docs.npmjs.com/cli/v7/commands/npm-install) | `npm install` | |
| 21 | +| [pnpm](https://pnpm.io/installation) | `pnpm install` | |
| 22 | +| [bun](https://bun.sh/#getting-started) | `bun install` | |
| 23 | + |
| 24 | +After completing the installation, your environment is ready for Vuetify development. |
| 25 | + |
| 26 | +## ✨ Features |
| 27 | + |
| 28 | +- 🖼️ **Optimized Front-End Stack**: Leverage the latest Vue 3 and Vuetify 3 for a modern, reactive UI development experience. [Vue 3](https://v3.vuejs.org/) | [Vuetify 3](https://vuetifyjs.com/en/) |
| 29 | +- 🗃️ **State Management**: Integrated with [Pinia](https://pinia.vuejs.org/), the intuitive, modular state management solution for Vue. |
| 30 | +- 🚦 **Routing and Layouts**: Utilizes Vue Router for SPA navigation and vite-plugin-vue-layouts-next for organizing Vue file layouts. [Vue Router](https://router.vuejs.org/) | [vite-plugin-vue-layouts-next](https://github.com/loicduong/vite-plugin-vue-layouts-next) |
| 31 | +- 💻 **Enhanced Development Experience**: Benefit from TypeScript's static type checking and the ESLint plugin suite for Vue, ensuring code quality and consistency. [TypeScript](https://www.typescriptlang.org/) | [ESLint Plugin Vue](https://eslint.vuejs.org/) |
| 32 | +- ⚡ **Next-Gen Tooling**: Powered by Vite, experience fast cold starts and instant HMR (Hot Module Replacement). [Vite](https://vitejs.dev/) |
| 33 | +- 🧩 **Automated Component Importing**: Streamline your workflow with unplugin-vue-components, automatically importing components as you use them. [unplugin-vue-components](https://github.com/antfu/unplugin-vue-components) |
| 34 | +- 🛠️ **Strongly-Typed Vue**: Use vue-tsc for type-checking your Vue components, and enjoy a robust development experience. [vue-tsc](https://github.com/johnsoncodehk/volar/tree/master/packages/vue-tsc) |
| 35 | + |
| 36 | +These features are curated to provide a seamless development experience from setup to deployment, ensuring that your Vuetify application is both powerful and maintainable. |
| 37 | + |
| 38 | +## 💡 Usage |
| 39 | + |
| 40 | +This section covers how to start the development server and build your project for production. |
| 41 | + |
| 42 | +### Starting the Development Server |
| 43 | + |
| 44 | +To start the development server with hot-reload, run the following command. The server will be accessible at [http://localhost:3000](http://localhost:3000): |
| 45 | + |
| 46 | +```bash |
| 47 | +yarn dev |
| 48 | +``` |
| 49 | + |
| 50 | +(Repeat for npm, pnpm, and bun with respective commands.) |
| 51 | + |
| 52 | +> Add NODE_OPTIONS='--no-warnings' to suppress the JSON import warnings that happen as part of the Vuetify import mapping. If you are on Node [v21.3.0](https://nodejs.org/en/blog/release/v21.3.0) or higher, you can change this to NODE_OPTIONS='--disable-warning=5401'. If you don't mind the warning, you can remove this from your package.json dev script. |
| 53 | +
|
| 54 | +### Building for Production |
| 55 | + |
| 56 | +To build your project for production, use: |
| 57 | + |
| 58 | +```bash |
| 59 | +yarn build |
| 60 | +``` |
| 61 | + |
| 62 | +(Repeat for npm, pnpm, and bun with respective commands.) |
| 63 | + |
| 64 | +Once the build process is completed, your application will be ready for deployment in a production environment. |
| 65 | + |
| 66 | +## 💪 Support Vuetify Development |
| 67 | + |
| 68 | +This project is built with [Vuetify](https://vuetifyjs.com/en/), a UI Library with a comprehensive collection of Vue components. Vuetify is an MIT licensed Open Source project that has been made possible due to the generous contributions by our [sponsors and backers](https://vuetifyjs.com/introduction/sponsors-and-backers/). If you are interested in supporting this project, please consider: |
| 69 | + |
| 70 | +- [Requesting Enterprise Support](https://support.vuetifyjs.com/) |
| 71 | +- [Sponsoring John on Github](https://github.com/users/johnleider/sponsorship) |
| 72 | +- [Sponsoring Kael on Github](https://github.com/users/kaelwd/sponsorship) |
| 73 | +- [Supporting the team on Open Collective](https://opencollective.com/vuetify) |
| 74 | +- [Becoming a sponsor on Patreon](https://www.patreon.com/vuetify) |
| 75 | +- [Becoming a subscriber on Tidelift](https://tidelift.com/subscription/npm/vuetify) |
| 76 | +- [Making a one-time donation with Paypal](https://paypal.me/vuetify) |
| 77 | + |
| 78 | +## 📑 License |
| 79 | +[MIT](http://opensource.org/licenses/MIT) |
| 80 | + |
| 81 | +Copyright (c) 2016-present Vuetify, LLC |
0 commit comments