You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
> This module is under active development. While it is already used to power a [handful of sites](https://nuxtify.dev/showcase) in production, expect things to change frequently. I will do my best to call out breaking changes in the [changelog](https://github.com/nuxtify-dev/core/blob/main/CHANGELOG.md).
15
+
16
+
### Table of Contents
17
+
18
+
- ♾️ [Why Nuxtify?](#why-nuxtify)
19
+
- 🧩 [Nuxtify Modules](#modules)
20
+
- ✨ [Features](#features)
21
+
- 🚀 [Quick Start](#quick-start)
22
+
- 🔧 [Configuration](#configuration)
23
+
- ✅ [Updates](#updates)
24
+
- ❤️ [Contributing](#contributing)
25
+
- 🏠 [Local Development](#local-development)
26
+
- ⚖️ [License](#license)
27
+
28
+
## <aname="why-nuxtify">♾️ Why Nuxtify?</a>
29
+
30
+
Nuxtify is a collection of [Nuxt modules](https://nuxt.com/docs/guide/concepts/modules) that help you stay organized, maintain focus, and _ship weirdly fast_.
31
+
32
+
It's built on a loosely opinionated stack that eliminates decision fatigue and ensures consistency across projects. This extensible approach gives you incredible control over your site's structure and style.
33
+
34
+
Once you add a Nuxtify module (like this one) to a new or existing Nuxt project, you can use any of the components, composables, and other features instantly – no imports necessary. And more importantly, you can override these defaults with your own version at any time.
35
+
36
+
**This unlocks a powerful way of working.**
37
+
38
+
Use the defaults when they're helpful, and progressively upgrade when they're not.
39
+
40
+
This means you can:
41
+
42
+
- Setup a new project using the default configuration in a matter of minutes.
43
+
- Use the default footer component, but completely change the navigation component.
44
+
- Change the colors of all the buttons with one line of code.
45
+
- Override the default button component with a style of your choosing.
46
+
- And much more...
47
+
48
+
In short, Nuxtify helps you build faster, iterate smarter, and maintain consistency – without sacrificing control or creativity.
49
+
50
+
## <aname="modules">🧩 Modules</a>
51
+
52
+
### Nuxtify Core (this module)
53
+
54
+
Provides the core functionality for Nuxtify, including:
55
+
56
+
- Default components, composables, and utilities
57
+
- Global configuration and theming with [Vuetify](https://vuetifyjs.com/en/introduction/why-vuetify/)
Provides single and multi-page website building blocks so you can _ship weirdly fast_.
62
+
63
+
- Ready to use page components, page templates, and email subscribe form
64
+
- (coming soon) Robots, sitemaps, schema.org, social share images, broken links, and more powered by [Nuxt SEO](https://nuxtseo.com/)
65
+
66
+
## <aname="features">✨ Features</a>
67
+
68
+
Nuxtify core builds on the amazing features of [Vue](https://vuejs.org/guide/introduction), [Nuxt](https://nuxt.com/docs/getting-started/introduction), and [Vuetify](https://vuetifyjs.com/en/introduction/why-vuetify/).
69
+
70
+
### 💡 Intuitive UI & UX
71
+
72
+
- Easily override any component with [Vuetify global defaults](https://vuetifyjs.com/en/features/global-configuration/)
73
+
- Icons powered by [Material Design Icons](https://pictogrammers.com/library/mdi/) via [Vuetify icon fonts](https://vuetifyjs.com/en/features/icon-fonts/)
74
+
- Fully responsive and adapts to all modern browsers and devices
75
+
- (coming soon) Light and dark mode toggle
76
+
77
+
### 💎 Premium DX
78
+
79
+
- Zero-config with sensible defaults for common use cases
80
+
- All components use the modern [Vue Composition API](https://vuejs.org/guide/extras/composition-api-faq) and [Single File Component (SFC) syntax](https://vuejs.org/guide/scaling-up/sfc.html)
81
+
-[TypeScript](https://www.typescriptlang.org/) auto-complete and type safety for all components
82
+
-[ESLint](https://eslint.org/) support out of the box using flat config (v9)
83
+
- Identify performance gaps and seamlessly manage your app with [Nuxt Devtools](https://devtools.nuxt.com/)
84
+
- Clean, elegant code that's easy to understand and customize
85
+
- Loosely opinionated, leveraging ecosystem standards so you're not locked into outdated dependencies and practices
86
+
87
+
### 🤖 Security & Performance
88
+
89
+
- Fully tree shakeable for small bundle sizes
90
+
- Optimized caching and rendering strategies for each page with [hybrid rendering](https://nuxt.com/docs/guide/concepts/rendering#hybrid-rendering)
91
+
- (coming soon) Fast, responsive, optimized images for [20+ image providers](https://image.nuxt.com/get-started/providers) powered by [Nuxt Image](https://image.nuxt.com/)
92
+
- (coming soon) Load third-party scripts with better performance, privacy, security powered by [Nuxt Scripts](https://scripts.nuxt.com/)
93
+
- (coming soon) Optimal security patterns and principles powered by [Nuxt Security](https://nuxt.com/modules/security)
94
+
95
+
### 🌐 Host Anywhere
96
+
97
+
- Deploy to any Node.js server, static host, or serverless edge CDN environment with [20+ hosting providers](https://nuxt.com/deploy) supported
98
+
99
+
## <aname="quick-start">🚀 Quick Start</a>
100
+
101
+
To use this module in your [new](https://nuxt.com/docs/getting-started/installation) or existing Nuxt project:
102
+
103
+
### 1. Install the module
16
104
17
-
My new Nuxt module for doing amazing things.
105
+
Install the module in your Nuxt application with one command:
Add the `@nuxtify/core` module to `nuxt.config.ts` and configure it:
114
+
115
+
```ts
116
+
// nuxt.config.ts
117
+
118
+
exportdefaultdefineNuxtConfig({
119
+
modules: ["@nuxtify/core"],
120
+
nuxtifyCore: {
121
+
/* module specific options */
122
+
},
123
+
});
124
+
```
125
+
126
+
Read the [📖 documentation](https://nuxtify.dev/docs) for a complete guide on how to configure and use this module.
127
+
128
+
### 3. Start building!
22
129
23
-
## Features
130
+
Develop and [deploy](https://nuxt.com/docs/getting-started/deployment) your Nuxt app like any other.
24
131
25
-
<!-- Highlight some of the features your module provide here -->
132
+
## <aname="configuration">🔧 Configuration</a>
26
133
27
-
- ⛰ Foo
28
-
- 🚠 Bar
29
-
- 🌲 Baz
134
+
### Module configuration
30
135
31
-
## Quick Setup
136
+
To see the full config, check out the [types](https://github.com/nuxtify-dev/core/blob/main/src/types.ts).
32
137
33
-
Install the module to your Nuxt application with one command:
138
+
### Overriding the defaults
139
+
140
+
Nuxtify comes pre-configured with sensible defaults. Both for how the module functions and for the corresponding Nuxt [directory](https://nuxt.com/docs/guide/directory-structure).
141
+
142
+
If you need to override a [component](https://nuxt.com/docs/guide/directory-structure/components), [page](https://nuxt.com/docs/guide/directory-structure/pages), or [layout](https://nuxt.com/docs/guide/directory-structure/layouts), create the a file with the same name in your project (in the appropriate directory).
143
+
144
+
If you need to override a [composable](https://nuxt.com/docs/guide/directory-structure/composables) or [utils](https://nuxt.com/docs/guide/directory-structure/utils) utility function, create a function with the same name in your project (in the appropriate directory).
145
+
146
+
## <aname="updates">✅ Updates</a>
147
+
148
+
[✨ Release Notes](/CHANGELOG.md)
149
+
150
+
It's easy to stay up to date with the latest version of Nuxtify. Just update to the latest package using your favorite package manager.
151
+
152
+
**Minor and patch versions**
34
153
35
154
```bash
36
-
npx nuxi module add @nuxtify/core
155
+
npm update @nuxtify/core --save
37
156
```
38
157
39
-
That's it! You can now use My Module in your Nuxt app ✨
158
+
**Major versions**
40
159
41
-
## Contribution
160
+
```bash
161
+
npm install @nuxtify/core@latest --save
162
+
```
163
+
164
+
## <aname="contributing">❤️ Contributing</a>
165
+
166
+
I invite you to contribute and help improve Nuxtify!
167
+
168
+
Here are a few ways you can get involved:
42
169
43
-
<details>
44
-
<summary>Local development</summary>
45
-
46
-
```bash
170
+
-**Reporting Bugs:** If you come across any bugs or issues, please [open a new issue](https://github.com/nuxtify-dev/core/issues/new).
171
+
-**Suggestions:** Have ideas to enhance Nuxtify? I'd love to hear them! You can [open a new issue](https://github.com/nuxtify-dev/core/issues/new) describing your feature request or suggestion.
172
+
-**Local Development:** contribute directly to the framework with a pull request. Just follow the instructions below.
173
+
174
+
## <aname="local-development">🏠 Local Development</a>
175
+
176
+
### CLI commands
177
+
178
+
```bash
47
179
# Install dependencies
48
180
npm install
49
-
181
+
50
182
# Generate type stubs
51
183
npm run dev:prepare
52
-
184
+
53
185
# Develop with the playground
54
186
npm run dev
55
-
187
+
56
188
# Build the playground
57
189
npm run dev:build
58
-
190
+
59
191
# Run ESLint
60
192
npm run lint
61
-
193
+
62
194
# Run Vitest
63
195
npm run test
64
196
npm run test:watch
65
-
66
-
# Release new version
67
-
npm run release
68
-
```
197
+
```
198
+
199
+
Learn about [authoring Nuxt modules](https://nuxt.com/docs/guide/going-further/modules).
0 commit comments