@shardev/vite-plugin-modular 1.1.0 → 1.2.0

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.
package/README.md CHANGED
@@ -1,240 +1,149 @@
1
- # 🚀 @shardev/vite-plugin
1
+ # @shardev/vite-plugin-modular
2
2
 
3
- > Advanced modular Laravel + Vite 7 integration system\
4
- > Monorepo-ready. Namespace-aware. Production-focused.
3
+ Vite plugin for modular Laravel applications.
5
4
 
6
- ------------------------------------------------------------------------
5
+ This plugin allows you to:
7
6
 
8
- ## Features
7
+ - Discover Vite modules inside `packages/`
8
+ - Automatically merge aliases and rollup inputs
9
+ - Enable per-module HMR
10
+ - Watch either `srcDir` or `publishedDir`
11
+ - Respect module enable/disable via `modules.json`
12
+ - Keep modules fully isolated
9
13
 
10
- - 📦 Automatic module discovery from `packages/`
11
- - 🔥 Namespace resolution (`vendor:package::file`)
12
- - 🧠 Smart alias injection
13
- - 🏗️ Workspace vs Published detection
14
- - 📄 Manifest rewriting with namespaced keys
15
- - ⚡ Compatible with **Vite 7+**
16
- - 🧩 Designed for **Laravel + React + TypeScript** stacks
14
+ Designed for large-scale Laravel + modular monorepo architectures.
17
15
 
18
16
  ------------------------------------------------------------------------
19
17
 
20
- ## 📦 Installation
18
+ # Installation
21
19
 
22
20
  ``` bash
23
- npm install @shardev/vite-plugin --save-dev
21
+ npm install @shardev/vite-plugin-modular --save-dev
24
22
  ```
25
23
 
26
24
  ------------------------------------------------------------------------
27
25
 
28
- ## 🔧 Requirements
26
+ # Architecture Overview
27
+
28
+ The system is composed of two plugins:
29
+
30
+ 1. `laravelModule` -- Used inside each module.
31
+ 2. `laravelModules` -- Used at the root Vite config to auto-discover
32
+ modules.
33
+
34
+ ------------------------------------------------------------------------
35
+
36
+ # Module Structure Example
29
37
 
30
- - Node \>= 20
31
- - Vite \^7
32
- - laravel-vite-plugin \^2
38
+ packages/
39
+ └── shardevcom/
40
+ └── blog/
41
+ ├── vite.config.ts
42
+ └── resources/
43
+ └── react/
44
+ └── src/
45
+ └── main.ts
33
46
 
34
47
  ------------------------------------------------------------------------
35
48
 
36
- # 🏗 Usage
49
+ # Module-Level Configuration
37
50
 
38
- ## 1️⃣ Root Project (vite.config.ts)
51
+ `packages/shardevcom/blog/vite.config.ts`
39
52
 
40
53
  ``` ts
41
54
  import { defineConfig } from 'vite'
42
- import laravel from 'laravel-vite-plugin'
43
- import { laravelModules } from '@shardev/vite-plugin'
55
+ import { laravelModule } from '@shardev/vite-plugin-modular'
44
56
 
45
57
  export default defineConfig({
46
- plugins: [
47
- laravelModules({
48
- modulesDir: "packages",
49
- statusesFile: "modules.json"
50
- }),
51
- laravel({
52
- input: [
53
- 'resources/css/app.css',
54
- 'resources/react/app.tsx'
55
- ],
56
- refresh: true
57
- })
58
- ]
58
+ plugins: [
59
+ laravelModule({
60
+ name: 'blog',
61
+ mode: 'integrated',
62
+ srcDir: 'resources/react/src',
63
+ input: {
64
+ main: 'resources/react/src/main.ts'
65
+ },
66
+ buildDir: 'build/blog'
67
+ })
68
+ ]
59
69
  })
60
70
  ```
61
71
 
62
72
  ------------------------------------------------------------------------
63
73
 
64
- ## 2️⃣ Inside a Module
74
+ # Root Configuration
65
75
 
66
- `packages/vendor/package/vite.config.ts`
76
+ `vite.config.ts`
67
77
 
68
78
  ``` ts
69
79
  import { defineConfig } from 'vite'
70
- import { laravelModule } from '@shardev/vite-plugin'
80
+ import { laravelModules } from '@shardev/vite-plugin-modular'
71
81
 
72
82
  export default defineConfig({
73
- plugins: [
74
- laravelModule({
75
- name: "package",
76
- vendor: "vendor"
77
- })
78
- ]
83
+ plugins: [
84
+ laravelModules({
85
+ modulesDir: 'packages',
86
+ statusesFile: 'modules.json',
87
+ debug: false,
88
+ useMetaCache: true
89
+ })
90
+ ]
79
91
  })
80
92
  ```
81
93
 
82
94
  ------------------------------------------------------------------------
83
95
 
84
- # 🧾 Using a Module in Laravel Blade
85
-
86
- Inside your Laravel Blade view:
87
-
88
- ``` blade
89
- <!DOCTYPE html>
90
- <html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
91
- <head>
92
- <meta charset="utf-8">
93
- <meta name="viewport" content="width=device-width, initial-scale=1">
94
- <meta name="csrf-token" content="{{ csrf_token() }}">
95
- <title>Module</title>
96
-
97
- @viteReactRefresh
98
- @vite(['shardevcom:packagemanager::index.tsx'])
99
- </head>
100
- <body>
101
- <div id="packagesmanager"></div>
102
- </body>
103
- </html>
104
- ```
105
-
106
- ### ✅ What's happening here?
107
-
108
- - `shardevcom:packagemanager::index.tsx`\
109
- Uses the namespace format:
110
-
111
- vendor:package::file
112
-
113
- - The plugin resolves automatically to:
114
-
115
- packages/shardevcom/packagemanager/resources/react/src/index.tsx
96
+ # Module Enable / Disable
116
97
 
117
- Or to the published path if it exists.
118
-
119
- This allows clean, modular asset loading directly from Blade without
120
- manual path management.
121
-
122
- ------------------------------------------------------------------------
123
-
124
- # 📂 Recommended Project Structure
125
-
126
- project-root/
127
-
128
- ├─ packages/
129
- │ └─ vendor/
130
- │ └─ package/
131
- │ ├─ resources/react/src/
132
- │ └─ vite.config.ts
133
-
134
- ├─ resources/
135
- ├─ modules.json
136
- └─ vite.config.ts
137
-
138
- ------------------------------------------------------------------------
139
-
140
- # 📑 modules.json
141
-
142
- Enable or disable modules easily:
98
+ Create a `modules.json` file:
143
99
 
144
100
  ``` json
145
101
  {
146
- "vendor/package": true,
147
- "vendor/other-module": false
102
+ "blog": true,
103
+ "shop": false
148
104
  }
149
105
  ```
150
106
 
151
- ------------------------------------------------------------------------
152
-
153
- # 🧠 How It Works
154
-
155
- ### 🔍 Module Discovery
156
-
157
- - Scans `packages/`
158
- - Loads each module's `vite.config.ts`
159
- - Extracts metadata from `laravelModule()`
107
+ If a module is set to `false`, it will not be loaded.
160
108
 
161
109
  ------------------------------------------------------------------------
162
110
 
163
- ### 🧩 Namespace Imports
164
-
165
- You can reference files like:
111
+ # Watch Behavior
166
112
 
167
- vendor:package::components/Button.tsx
113
+ Each module registers a watcher based on:
168
114
 
169
- The plugin resolves automatically to:
115
+ usePublished && publishedDir ? publishedDir : srcDir
170
116
 
171
- packages/vendor/package/resources/react/src/components/Button.tsx
117
+ This allows:
172
118
 
173
- Or the published path if available.
119
+ - Developing directly from source
120
+ - Or watching compiled/published output
174
121
 
175
122
  ------------------------------------------------------------------------
176
123
 
177
- ### 📄 Manifest Enhancement
178
-
179
- The plugin rewrites `manifest.json` and injects:
180
-
181
- vendor:package::file.tsx
182
-
183
- So Laravel can resolve namespaced assets cleanly.
184
-
185
- ------------------------------------------------------------------------
186
-
187
- # ⚙ API
188
-
189
- ## laravelModules(options)
190
-
191
- Option Type Default
192
- -------------- -------- ----------------
193
- modulesDir string "packages"
194
- statusesFile string "modules.json"
124
+ # HMR Behavior
195
125
 
196
- ------------------------------------------------------------------------
126
+ When a file changes inside a module:
197
127
 
198
- ## laravelModule(options)
128
+ - The module graph invalidates the affected module
129
+ - A manual HMR update is triggered
130
+ - Only the affected module is refreshed
199
131
 
200
- Option Type Default
201
- -------------- ------------ ------------------------
202
- name string required
203
- vendor string "shardevcom"
204
- srcDir string "resources/react/src"
205
- inputs string\[\] \["main.tsx"\]
206
- buildDir string build/{vendor}/{name}
207
- publishedDir string resources/react/{name}
132
+ This ensures isolation between modules.
208
133
 
209
134
  ------------------------------------------------------------------------
210
135
 
211
- # 🛠 Development
212
-
213
- ``` bash
214
- npm run build
215
- npm run dev
216
- ```
217
-
218
- ------------------------------------------------------------------------
136
+ # Production Behavior
219
137
 
220
- # 📜 License
138
+ During `vite build`:
221
139
 
222
- MIT © Shardev Community
140
+ - All module inputs are merged
141
+ - Aliases are merged
142
+ - Rollup handles all entries
143
+ - Outputs remain isolated per module
223
144
 
224
145
  ------------------------------------------------------------------------
225
146
 
226
- # 🔥 Vision
227
-
228
- This plugin is designed to evolve into a **modular frontend framework
229
- layer for Laravel**.
230
-
231
- It enables:
232
-
233
- - Enterprise module isolation
234
- - Frontend domain separation
235
- - Scalable monorepo architecture
236
- - Clean namespace asset resolution
237
-
238
- ------------------------------------------------------------------------
147
+ # License
239
148
 
240
- Made with ❤️ for scalable Laravel systems.
149
+ MIT