|
1 | | -# Vuetify (Default) |
| 1 | +# JSON.ms |
2 | 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. |
| 3 | +Just a small demo containing a presentation and a playground to follow along while exploring JSON.ms for the first time. |
4 | 4 |
|
5 | | -## ❗️ Important Links |
| 5 | +### Install dependencies: |
| 6 | +```sh |
| 7 | +# Using Yarn |
| 8 | +yarn |
6 | 9 |
|
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 for organizing Vue file layouts. [Vue Router](https://router.vuejs.org/) | [vite-plugin-vue-layouts](https://github.com/JohnCampionJr/vite-plugin-vue-layouts) |
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 |
| 10 | +# OR using npm |
| 11 | +npm install |
48 | 12 | ``` |
49 | 13 |
|
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: |
| 14 | +### Start the development server: |
| 15 | +```sh |
| 16 | +# Using Yarn |
| 17 | +yarn dev |
57 | 18 |
|
58 | | -```bash |
59 | | -yarn build |
| 19 | +# OR using npm |
| 20 | +npm run dev |
60 | 21 | ``` |
61 | 22 |
|
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 |
| 23 | +## License |
| 24 | +MIT |
0 commit comments