nuxt-loaders 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +74 -50
  3. package/dist/bin/loaders.mjs +0 -0
  4. package/dist/module.json +1 -1
  5. package/package.json +17 -15
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2025 Haileab Tesfaye
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -2,83 +2,107 @@
2
2
  Get your module up and running quickly.
3
3
 
4
4
  Find and replace all on all files (CMD+SHIFT+F):
5
- - Name: My Module
6
- - Package name: my-module
7
- - Description: My new Nuxt module
5
+ - Name: Nuxt Loaders
6
+ - Package name: nuxt-loaders
7
+ - Description: Simple loading screen engine for Nuxt 4+
8
8
  -->
9
9
 
10
- # My Module
10
+ # Nuxt Loaders
11
11
 
12
12
  [![npm version][npm-version-src]][npm-version-href]
13
13
  [![npm downloads][npm-downloads-src]][npm-downloads-href]
14
14
  [![License][license-src]][license-href]
15
15
  [![Nuxt][nuxt-src]][nuxt-href]
16
16
 
17
- My new Nuxt module for doing amazing things.
17
+ Simple loading screen engine for Nuxt 4+.
18
18
 
19
19
  - [✨  Release Notes](/CHANGELOG.md)
20
- <!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
21
- <!-- - [📖 &nbsp;Documentation](https://example.com) -->
20
+ <!-- - [🏀 Online playground](https://stackblitz.com/github/haileabt/nuxt-loaders?file=playground%2Fapp.vue) -->
21
+ <!-- - [📖 &nbsp;Documentation](https://example.com) -->
22
22
 
23
23
  ## Features
24
24
 
25
- <!-- Highlight some of the features your module provide here -->
26
- - ⛰ &nbsp;Foo
27
- - 🚠 &nbsp;Bar
28
- - 🌲 &nbsp;Baz
25
+ - 🔄 **Automatic Loader Registration**: Automatically registers loader components from your specified directory.
26
+ - 🛣️ **Route-based Configuration**: Assign specific loaders to different routes using `routeRules`.
27
+ - 🎨 **TailwindCSS Integration**: Includes TailwindCSS support out of the box.
28
+ - ⚡ **Zero Configuration**: Works with sensible defaults, but fully customizable.
29
29
 
30
30
  ## Quick Setup
31
31
 
32
- Install the module to your Nuxt application with one command:
32
+ 1. Add `nuxt-loaders` dependency to your project
33
33
 
34
34
  ```bash
35
- npx nuxi module add my-module
35
+ npx nuxi module add nuxt-loaders
36
36
  ```
37
37
 
38
- That's it! You can now use My Module in your Nuxt app ✨
38
+ 2. Add `nuxt-loaders` to the `modules` section of `nuxt.config.ts`
39
39
 
40
+ ```ts
41
+ export default defineNuxtConfig({
42
+ modules: ["nuxt-loaders"],
43
+ });
44
+ ```
40
45
 
41
- ## Contribution
46
+ That's it! You can now use Nuxt Loaders in your Nuxt app ✨
42
47
 
43
- <details>
44
- <summary>Local development</summary>
45
-
46
- ```bash
47
- # Install dependencies
48
- npm install
49
-
50
- # Generate type stubs
51
- npm run dev:prepare
52
-
53
- # Develop with the playground
54
- npm run dev
55
-
56
- # Build the playground
57
- npm run dev:build
58
-
59
- # Run ESLint
60
- npm run lint
61
-
62
- # Run Vitest
63
- npm run test
64
- npm run test:watch
65
-
66
- # Release new version
67
- npm run release
68
- ```
69
-
70
- </details>
48
+ ## Configuration
71
49
 
50
+ You can configure the module in your `nuxt.config.ts`:
72
51
 
73
- <!-- Badges -->
74
- [npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=020420&colorB=00DC82
75
- [npm-version-href]: https://npmjs.com/package/my-module
52
+ ```ts
53
+ export default defineNuxtConfig({
54
+ modules: ["nuxt-loaders"],
55
+ loaders: {
56
+ // Directory containing your loader components
57
+ // Default: 'app/components/loaders'
58
+ loadersDir: "app/components/loaders",
59
+
60
+ // Automatically setup the module
61
+ // Default: true
62
+ autoSetup: true,
63
+
64
+ // Define rules for which loader to use on which route
65
+ routeRules: {
66
+ "/": "MyLoader",
67
+ "/admin/**": "AdminLoader",
68
+ },
69
+ },
70
+ });
71
+ ```
72
+
73
+ ### Options
74
+
75
+ | Option | Type | Default | Description |
76
+ | ------------ | ------------------------ | -------------------------- | --------------------------------------------------- |
77
+ | `loadersDir` | `string` | `'app/components/loaders'` | Directory where your loader components are located. |
78
+ | `autoSetup` | `boolean` | `true` | Whether to automatically setup the module. |
79
+ | `routeRules` | `Record<string, string>` | `{}` | Map of route patterns to loader component names. |
76
80
 
77
- [npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=020420&colorB=00DC82
78
- [npm-downloads-href]: https://npm.chart.dev/my-module
81
+ ## Usage
79
82
 
80
- [license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=020420&colorB=00DC82
81
- [license-href]: https://npmjs.com/package/my-module
83
+ 1. Create your loader components in `app/components/loaders` (or your configured `loadersDir`).
84
+ 2. The module will automatically register these components.
85
+ 3. Use `routeRules` in your `nuxt.config.ts` to specify which loader should be active for specific routes.
86
+
87
+ Example loader component (`app/components/loaders/MyLoader.vue`):
88
+
89
+ ```vue
90
+ <template>
91
+ <div class="loader">Loading...</div>
92
+ </template>
93
+ ```
94
+
95
+ ## Contribution
96
+
97
+ Please read [CONTRIBUTING.md](CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to us.
98
+
99
+ <!-- Badges -->
82
100
 
101
+ [npm-version-src]: https://img.shields.io/npm/v/nuxt-loaders/latest.svg?style=flat&colorA=020420&colorB=00DC82
102
+ [npm-version-href]: https://npmjs.com/package/nuxt-loaders
103
+ [npm-downloads-src]: https://img.shields.io/npm/dm/nuxt-loaders.svg?style=flat&colorA=020420&colorB=00DC82
104
+ [npm-downloads-href]: https://npm.chart.dev/nuxt-loaders
105
+ [license-src]: https://img.shields.io/npm/l/nuxt-loaders.svg?style=flat&colorA=020420&colorB=00DC82
106
+ [license-href]: https://npmjs.com/package/nuxt-loaders
83
107
  [nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
84
108
  [nuxt-href]: https://nuxt.com
package/dist/bin/loaders.mjs CHANGED
File without changes
package/dist/module.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "nuxt-loaders",
3
3
  "configKey": "loaders",
4
- "version": "1.0.0",
4
+ "version": "1.0.1",
5
5
  "builder": {
6
6
  "@nuxt/module-builder": "1.0.2",
7
7
  "unbuild": "3.6.1"
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "nuxt-loaders",
3
- "version": "1.0.0",
4
- "description": "My new Nuxt module",
5
- "repository": "your-org/my-module",
3
+ "version": "1.0.1",
4
+ "description": "Simple loading screen engine for Nuxt 4+",
5
+ "repository": "haileabt/nuxt-loaders",
6
6
  "license": "MIT",
7
7
  "type": "module",
8
8
  "exports": {
@@ -25,6 +25,18 @@
25
25
  "bin": {
26
26
  "loaders": "./dist/bin/loaders.mjs"
27
27
  },
28
+ "scripts": {
29
+ "prepack": "nuxt-module-build build",
30
+ "dev": "npm run dev:prepare && nuxi dev playground",
31
+ "dev:build": "nuxi build playground",
32
+ "cli:build": "tsc",
33
+ "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
34
+ "release": "npm run lint && npm run test && npm run prepack && changelogen --release && npm publish && git push --follow-tags",
35
+ "lint": "eslint .",
36
+ "test": "vitest run",
37
+ "test:watch": "vitest watch",
38
+ "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit"
39
+ },
28
40
  "dependencies": {
29
41
  "@nuxt/kit": "^4.2.1",
30
42
  "@tailwindcss/vite": "^4.1.18",
@@ -46,15 +58,5 @@
46
58
  "vitest": "^3.2.0",
47
59
  "vue-tsc": "^3.1.7"
48
60
  },
49
- "scripts": {
50
- "dev": "npm run dev:prepare && nuxi dev playground",
51
- "dev:build": "nuxi build playground",
52
- "cli:build": "tsc",
53
- "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
54
- "release": "npm run lint && npm run test && npm run prepack && changelogen --release && npm publish && git push --follow-tags",
55
- "lint": "eslint .",
56
- "test": "vitest run",
57
- "test:watch": "vitest watch",
58
- "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit"
59
- }
60
- }
61
+ "packageManager": "pnpm@9.15.4+sha512.b2dc20e2fc72b3e18848459b37359a32064663e5627a51e4c74b2c29dd8e8e0491483c3abb40789cfd578bf362fb6ba8261b05f0387d76792ed6e23ea3b1b6a0"
62
+ }