elit 1.1.0 → 2.0.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 +267 -101
- package/dist/build.d.mts +11 -0
- package/dist/build.d.ts +11 -0
- package/dist/build.js +1 -0
- package/dist/build.mjs +1 -0
- package/dist/cli.js +2307 -0
- package/dist/client.d.mts +9 -0
- package/dist/client.d.ts +9 -0
- package/dist/client.js +1 -0
- package/dist/client.mjs +1 -0
- package/dist/dom.d.mts +80 -0
- package/dist/dom.d.ts +80 -0
- package/dist/dom.js +1 -0
- package/dist/dom.mjs +1 -0
- package/dist/el.d.mts +227 -0
- package/dist/el.d.ts +227 -0
- package/dist/el.js +1 -0
- package/dist/el.mjs +1 -0
- package/dist/hmr.d.mts +38 -0
- package/dist/hmr.d.ts +38 -0
- package/dist/hmr.js +1 -0
- package/dist/hmr.mjs +1 -0
- package/dist/index.d.mts +38 -619
- package/dist/index.d.ts +38 -619
- package/dist/index.js +1 -35
- package/dist/index.mjs +1 -35
- package/dist/router.d.mts +45 -0
- package/dist/router.d.ts +45 -0
- package/dist/router.js +1 -0
- package/dist/router.mjs +1 -0
- package/dist/server.d.mts +3 -0
- package/dist/server.d.ts +3 -0
- package/dist/server.js +1 -0
- package/dist/server.mjs +1 -0
- package/dist/state.d.mts +109 -0
- package/dist/state.d.ts +109 -0
- package/dist/state.js +1 -0
- package/dist/state.mjs +1 -0
- package/dist/style.d.mts +113 -0
- package/dist/style.d.ts +113 -0
- package/dist/style.js +1 -0
- package/dist/style.mjs +1 -0
- package/dist/types-DOAdFFJB.d.mts +330 -0
- package/dist/types-DOAdFFJB.d.ts +330 -0
- package/dist/types.d.mts +3 -0
- package/dist/types.d.ts +3 -0
- package/dist/types.js +1 -0
- package/dist/types.mjs +0 -0
- package/package.json +65 -2
- package/dist/index.global.js +0 -35
package/README.md
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
# Elit
|
|
2
2
|
|
|
3
|
-
⚡ A
|
|
3
|
+
⚡ A full-stack TypeScript framework (~10KB gzipped) with built-in dev server, HMR, build tool, and REST API. Zero dependencies, maximum productivity.
|
|
4
4
|
|
|
5
5
|
[](https://www.npmjs.com/package/elit)
|
|
6
6
|
[](https://opensource.org/licenses/MIT)
|
|
7
7
|
[](https://bundlephobia.com/package/elit)
|
|
8
8
|
|
|
9
|
-
> **Quick Links:** [Installation](#installation) | [Features](#features) | [Quick Start](#quick-start) | [
|
|
9
|
+
> **Quick Links:** [Installation](#installation) | [Features](#features) | [Quick Start](#quick-start) | [CLI Tools](#cli-tools) | [API](#api) | [Deployment](#deployment)
|
|
10
10
|
|
|
11
11
|
## Why Elit?
|
|
12
12
|
|
|
@@ -16,64 +16,166 @@
|
|
|
16
16
|
- **🔷 TypeScript First**: Full type safety and IntelliSense out of the box
|
|
17
17
|
- **🔄 Reactive State**: Simple but powerful reactive state management
|
|
18
18
|
- **🌲 Tree-Shakeable**: Import only what you need for optimal bundle size
|
|
19
|
-
- **🚀
|
|
20
|
-
-
|
|
19
|
+
- **🚀 Full-Stack Ready**: Built-in dev server, HMR, build tool, and REST API
|
|
20
|
+
- **🔥 Hot Module Replacement**: Instant development feedback with automatic HMR
|
|
21
|
+
- **🏗️ Build System**: Integrated esbuild with automatic client/server separation
|
|
22
|
+
- **🌐 REST API Router**: Built-in server-side routing with middleware stack
|
|
23
|
+
- **🔌 WebSocket Support**: Real-time state synchronization out of the box
|
|
24
|
+
- **🎨 Developer Experience**: CLI tools, zero config, and excellent tooling support
|
|
21
25
|
|
|
22
26
|
## Installation
|
|
23
27
|
|
|
24
28
|
```bash
|
|
25
29
|
npm install elit
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
## CLI Tools
|
|
33
|
+
|
|
34
|
+
Elit includes a powerful CLI for development and production:
|
|
35
|
+
|
|
36
|
+
```bash
|
|
37
|
+
# Development server with HMR
|
|
38
|
+
npx elit dev
|
|
39
|
+
|
|
40
|
+
# Production build
|
|
41
|
+
npx elit build
|
|
42
|
+
|
|
43
|
+
# Preview production build
|
|
44
|
+
npx elit preview
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
### Configuration
|
|
48
|
+
|
|
49
|
+
Create `elit.config.mjs` (or .ts, .js, .json) in your project root:
|
|
26
50
|
|
|
27
|
-
|
|
28
|
-
|
|
51
|
+
```javascript
|
|
52
|
+
import { defineConfig } from 'elit';
|
|
53
|
+
import { resolve } from 'path';
|
|
54
|
+
|
|
55
|
+
export default defineConfig({
|
|
56
|
+
dev: {
|
|
57
|
+
port: 3000,
|
|
58
|
+
host: 'localhost',
|
|
59
|
+
root: './src',
|
|
60
|
+
basePath: '/',
|
|
61
|
+
open: true
|
|
62
|
+
},
|
|
63
|
+
build: {
|
|
64
|
+
entry: './src/main.ts',
|
|
65
|
+
outDir: './dist',
|
|
66
|
+
format: 'esm',
|
|
67
|
+
minify: true,
|
|
68
|
+
platform: 'browser',
|
|
69
|
+
basePath: '/app',
|
|
70
|
+
copy: [
|
|
71
|
+
{
|
|
72
|
+
from: 'index.html',
|
|
73
|
+
to: 'index.html',
|
|
74
|
+
transform: (content, config) => {
|
|
75
|
+
// Inject base tag from basePath
|
|
76
|
+
return content;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
]
|
|
80
|
+
},
|
|
81
|
+
preview: {
|
|
82
|
+
port: 4173,
|
|
83
|
+
root: './dist',
|
|
84
|
+
basePath: '/app'
|
|
85
|
+
}
|
|
86
|
+
});
|
|
29
87
|
```
|
|
30
88
|
|
|
31
89
|
## Features
|
|
32
90
|
|
|
33
|
-
###
|
|
91
|
+
### Frontend Framework
|
|
34
92
|
|
|
35
|
-
- 🎯 **Ultra Lightweight**: Just 30KB minified, ~10KB gzipped
|
|
93
|
+
- 🎯 **Ultra Lightweight**: Just 30KB minified, ~10KB gzipped
|
|
36
94
|
- ⚡ **Reactive State**: Built-in reactive state management with `createState`
|
|
37
95
|
- 🔄 **Computed Values**: Automatic dependency tracking with `computed`
|
|
38
|
-
-
|
|
39
|
-
- 🎨 **CSS-in-JS**: Type-safe styling with `CreateStyle` - full CSS features support
|
|
96
|
+
- 🎨 **CSS-in-JS**: Type-safe styling with `CreateStyle`
|
|
40
97
|
- 🛣️ **Client-Side Router**: Hash and history mode routing with dynamic parameters
|
|
41
|
-
- 📱 **Virtual Scrolling**: Handle 100k+ items efficiently
|
|
98
|
+
- 📱 **Virtual Scrolling**: Handle 100k+ items efficiently
|
|
42
99
|
- 🖥️ **SSR Support**: Full server-side rendering capabilities
|
|
43
|
-
- 🎭 **SVG & MathML**: Complete support for
|
|
44
|
-
- 🔧 **Performance Utilities**: Throttle, debounce, batch rendering
|
|
45
|
-
- 📦 **Tree-Shakeable**: Import only what you need
|
|
46
|
-
- 🎮 **DOM Utilities**: Convenient helper functions
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
-
|
|
52
|
-
- 🌐 **REST API Router**:
|
|
53
|
-
- 🔧 **Middleware
|
|
54
|
-
- 🔄 **Shared State
|
|
55
|
-
- 📊 **WebSocket Support**: Built-in WebSocket server
|
|
56
|
-
- 📁 **Static File Server**:
|
|
100
|
+
- 🎭 **SVG & MathML**: Complete support for all elements
|
|
101
|
+
- 🔧 **Performance Utilities**: Throttle, debounce, batch rendering
|
|
102
|
+
- 📦 **Tree-Shakeable**: Import only what you need
|
|
103
|
+
- 🎮 **DOM Utilities**: Convenient helper functions
|
|
104
|
+
|
|
105
|
+
### Full-Stack Tools
|
|
106
|
+
|
|
107
|
+
- 🔥 **Hot Module Replacement**: Instant development feedback
|
|
108
|
+
- 🏗️ **Build System**: esbuild integration with automatic client/server separation
|
|
109
|
+
- 🌐 **REST API Router**: Server-side routing with middleware stack
|
|
110
|
+
- 🔧 **Middleware**: CORS, logging, error handling, rate limiting, compression, security
|
|
111
|
+
- 🔄 **Shared State**: Real-time WebSocket state synchronization
|
|
112
|
+
- 📊 **WebSocket Support**: Built-in WebSocket server
|
|
113
|
+
- 📁 **Static File Server**: Gzip compression and cache headers
|
|
57
114
|
- 🎯 **Zero Config**: Works out of the box with sensible defaults
|
|
58
|
-
-
|
|
59
|
-
- 📦 **Lightweight**: Minimal dependencies (chokidar, ws, mime-types)
|
|
115
|
+
- 🔐 **Environment Variables**: Support for .env files with VITE_ prefix
|
|
60
116
|
|
|
61
117
|
## Quick Start
|
|
62
118
|
|
|
63
|
-
###
|
|
64
|
-
|
|
65
|
-
Get started instantly with hot module replacement:
|
|
119
|
+
### 1. Create Your Project
|
|
66
120
|
|
|
67
121
|
```bash
|
|
68
|
-
#
|
|
122
|
+
# Create a new directory
|
|
123
|
+
mkdir my-elit-app
|
|
124
|
+
cd my-elit-app
|
|
125
|
+
|
|
126
|
+
# Initialize package.json
|
|
127
|
+
npm init -y
|
|
128
|
+
|
|
129
|
+
# Install Elit
|
|
69
130
|
npm install elit
|
|
70
|
-
|
|
131
|
+
```
|
|
71
132
|
|
|
72
|
-
|
|
73
|
-
|
|
133
|
+
### 2. Create Your App
|
|
134
|
+
|
|
135
|
+
Create `src/main.ts`:
|
|
136
|
+
|
|
137
|
+
```typescript
|
|
138
|
+
import { div, h1, button, createState, reactive, domNode } from 'elit';
|
|
139
|
+
|
|
140
|
+
const count = createState(0);
|
|
141
|
+
|
|
142
|
+
const app = div({ className: 'app' },
|
|
143
|
+
h1('Hello Elit! 🚀'),
|
|
144
|
+
reactive(count, (value) =>
|
|
145
|
+
button({
|
|
146
|
+
onclick: () => count.value++,
|
|
147
|
+
className: 'btn'
|
|
148
|
+
}, `Count: ${value}`)
|
|
149
|
+
)
|
|
150
|
+
);
|
|
151
|
+
|
|
152
|
+
domNode.render('#app', app);
|
|
74
153
|
```
|
|
75
154
|
|
|
76
|
-
|
|
155
|
+
Create `index.html`:
|
|
156
|
+
|
|
157
|
+
```html
|
|
158
|
+
<!DOCTYPE html>
|
|
159
|
+
<html lang="en">
|
|
160
|
+
<head>
|
|
161
|
+
<meta charset="UTF-8">
|
|
162
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
163
|
+
<title>Elit App</title>
|
|
164
|
+
</head>
|
|
165
|
+
<body>
|
|
166
|
+
<div id="app"></div>
|
|
167
|
+
<script type="module" src="src/main.ts"></script>
|
|
168
|
+
</body>
|
|
169
|
+
</html>
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
### 3. Start Development Server
|
|
173
|
+
|
|
174
|
+
```bash
|
|
175
|
+
npx elit dev
|
|
176
|
+
```
|
|
177
|
+
|
|
178
|
+
Your app will automatically reload when you make changes with HMR!
|
|
77
179
|
|
|
78
180
|
### NPM Installation
|
|
79
181
|
|
|
@@ -183,12 +285,12 @@ const inputEl = input({ type: 'text', ...bindValue(message) });
|
|
|
183
285
|
|
|
184
286
|
### Shared State (Real-time Sync)
|
|
185
287
|
|
|
186
|
-
**Requires
|
|
288
|
+
**Requires `elit-server`** - Shared state syncs automatically between backend and frontend via WebSocket:
|
|
187
289
|
|
|
188
290
|
```typescript
|
|
189
291
|
import { createSharedState, reactive } from 'elit';
|
|
190
292
|
|
|
191
|
-
// Create shared state (auto-connects to
|
|
293
|
+
// Create shared state (auto-connects to elit-server)
|
|
192
294
|
const counter = createSharedState('counter', 0);
|
|
193
295
|
const todos = createSharedState('todos', []);
|
|
194
296
|
|
|
@@ -209,10 +311,10 @@ counter.onChange((newValue, oldValue) => {
|
|
|
209
311
|
counter.value++;
|
|
210
312
|
```
|
|
211
313
|
|
|
212
|
-
**Backend (Node.js with
|
|
314
|
+
**Backend (Node.js with elit-server):**
|
|
213
315
|
|
|
214
316
|
```javascript
|
|
215
|
-
const { createDevServer } = require('
|
|
317
|
+
const { createDevServer } = require('elit-server');
|
|
216
318
|
|
|
217
319
|
const server = createDevServer({ port: 3000 });
|
|
218
320
|
|
|
@@ -229,12 +331,12 @@ counter.onChange((newValue, oldValue) => {
|
|
|
229
331
|
counter.value++;
|
|
230
332
|
```
|
|
231
333
|
|
|
232
|
-
###
|
|
334
|
+
### elit-server - Development Server
|
|
233
335
|
|
|
234
336
|
Full-featured development server with HMR, REST API, and real-time features:
|
|
235
337
|
|
|
236
338
|
```javascript
|
|
237
|
-
const { createDevServer, Router, cors, logger } = require('
|
|
339
|
+
const { createDevServer, Router, cors, logger } = require('elit-server');
|
|
238
340
|
|
|
239
341
|
// Create REST API router
|
|
240
342
|
const api = new Router();
|
|
@@ -299,7 +401,7 @@ const {
|
|
|
299
401
|
cacheControl, // Cache headers
|
|
300
402
|
compress, // Gzip compression
|
|
301
403
|
security // Security headers
|
|
302
|
-
} = require('
|
|
404
|
+
} = require('elit-server');
|
|
303
405
|
|
|
304
406
|
api.use(cors({ origin: '*' }));
|
|
305
407
|
api.use(logger());
|
|
@@ -599,97 +701,161 @@ const users: State<User[]> = createState([]);
|
|
|
599
701
|
// Full IntelliSense support for all 100+ HTML elements
|
|
600
702
|
```
|
|
601
703
|
|
|
602
|
-
##
|
|
704
|
+
## Deployment
|
|
603
705
|
|
|
604
|
-
|
|
605
|
-
|---------|------|-------|-----|--------|
|
|
606
|
-
| Bundle Size (min) | 30KB | ~140KB | ~90KB | ~15KB* |
|
|
607
|
-
| Zero Dependencies | ✅ | ❌ | ❌ | ✅ |
|
|
608
|
-
| Virtual DOM | ❌ | ✅ | ✅ | ❌ |
|
|
609
|
-
| TypeScript First | ✅ | ✅ | ✅ | ✅ |
|
|
610
|
-
| Built-in Router | ✅ | ❌ | ❌ | ❌ |
|
|
611
|
-
| Built-in State | ✅ | ❌ | ✅ | ✅ |
|
|
612
|
-
| SSR Support | ✅ | ✅ | ✅ | ✅ |
|
|
613
|
-
| Learning Curve | Easy | Medium | Medium | Easy |
|
|
706
|
+
Deploy your Elit application to production:
|
|
614
707
|
|
|
615
|
-
|
|
708
|
+
### Build for Production
|
|
616
709
|
|
|
617
|
-
|
|
710
|
+
```bash
|
|
711
|
+
# Build your app
|
|
712
|
+
npx elit build
|
|
618
713
|
|
|
619
|
-
|
|
714
|
+
# Preview production build
|
|
715
|
+
npx elit preview
|
|
716
|
+
```
|
|
620
717
|
|
|
621
|
-
###
|
|
622
|
-
|
|
718
|
+
### Deploy to Vercel
|
|
719
|
+
|
|
720
|
+
```bash
|
|
721
|
+
npm i -g vercel
|
|
722
|
+
npm run build
|
|
723
|
+
vercel --prod
|
|
724
|
+
```
|
|
623
725
|
|
|
624
|
-
|
|
726
|
+
### Deploy to Netlify
|
|
625
727
|
|
|
626
728
|
```bash
|
|
627
|
-
npm
|
|
729
|
+
npm i -g netlify-cli
|
|
730
|
+
npm run build
|
|
731
|
+
netlify deploy --prod --dir=dist
|
|
628
732
|
```
|
|
629
733
|
|
|
630
|
-
###
|
|
631
|
-
|
|
734
|
+
### Deploy to GitHub Pages
|
|
735
|
+
|
|
736
|
+
Create `.github/workflows/deploy.yml`:
|
|
737
|
+
|
|
738
|
+
```yaml
|
|
739
|
+
name: Deploy to GitHub Pages
|
|
740
|
+
|
|
741
|
+
on:
|
|
742
|
+
push:
|
|
743
|
+
branches: [main]
|
|
744
|
+
|
|
745
|
+
jobs:
|
|
746
|
+
deploy:
|
|
747
|
+
runs-on: ubuntu-latest
|
|
748
|
+
steps:
|
|
749
|
+
- uses: actions/checkout@v3
|
|
750
|
+
- uses: actions/setup-node@v3
|
|
751
|
+
with:
|
|
752
|
+
node-version: 18
|
|
753
|
+
- run: npm install
|
|
754
|
+
- run: npm run build
|
|
755
|
+
- uses: peaceiris/actions-gh-pages@v3
|
|
756
|
+
with:
|
|
757
|
+
github_token: ${{ secrets.GITHUB_TOKEN }}
|
|
758
|
+
publish_dir: ./dist
|
|
759
|
+
```
|
|
632
760
|
|
|
633
|
-
|
|
761
|
+
### Docker Deployment
|
|
634
762
|
|
|
635
|
-
```
|
|
636
|
-
|
|
763
|
+
```dockerfile
|
|
764
|
+
FROM node:18-alpine AS builder
|
|
765
|
+
WORKDIR /app
|
|
766
|
+
COPY package*.json ./
|
|
767
|
+
RUN npm install
|
|
768
|
+
COPY . .
|
|
769
|
+
RUN npm run build
|
|
770
|
+
|
|
771
|
+
FROM nginx:alpine
|
|
772
|
+
COPY --from=builder /app/dist /usr/share/nginx/html
|
|
773
|
+
EXPOSE 80
|
|
774
|
+
CMD ["nginx", "-g", "daemon off;"]
|
|
637
775
|
```
|
|
638
776
|
|
|
639
|
-
|
|
777
|
+
### Environment Variables
|
|
778
|
+
|
|
779
|
+
Create `.env.production`:
|
|
780
|
+
|
|
781
|
+
```env
|
|
782
|
+
VITE_API_URL=https://api.example.com
|
|
783
|
+
VITE_ENV=production
|
|
784
|
+
```
|
|
785
|
+
|
|
786
|
+
Access in your code:
|
|
787
|
+
|
|
788
|
+
```typescript
|
|
789
|
+
const apiUrl = import.meta.env.VITE_API_URL;
|
|
790
|
+
const isProd = import.meta.env.PROD;
|
|
791
|
+
```
|
|
792
|
+
|
|
793
|
+
## Comparison with Other Frameworks
|
|
794
|
+
|
|
795
|
+
| Feature | Elit | Vite + React | Next.js | SvelteKit |
|
|
796
|
+
|---------|----------|--------------|---------|-----------|
|
|
797
|
+
| Bundle Size | 30KB | ~140KB+ | ~200KB+ | ~15KB* |
|
|
798
|
+
| Zero Dependencies | ✅ | ❌ | ❌ | ❌ |
|
|
799
|
+
| Dev Server | ✅ Built-in | ✅ Vite | ✅ Built-in | ✅ Built-in |
|
|
800
|
+
| HMR | ✅ | ✅ | ✅ | ✅ |
|
|
801
|
+
| Build Tool | ✅ Built-in | ✅ Vite | ✅ Built-in | ✅ Built-in |
|
|
802
|
+
| REST API | ✅ Built-in | ❌ | ✅ | ✅ |
|
|
803
|
+
| TypeScript | ✅ | ✅ | ✅ | ✅ |
|
|
804
|
+
| SSR | ✅ | ❌ | ✅ | ✅ |
|
|
805
|
+
| Learning Curve | Easy | Medium | Medium | Easy |
|
|
806
|
+
|
|
807
|
+
*Svelte requires compilation
|
|
640
808
|
|
|
641
809
|
## Documentation
|
|
642
810
|
|
|
643
|
-
- 📚 [Documentation
|
|
644
|
-
- ⚡ [Quick Start Guide](./docs/QUICK_START.md)
|
|
645
|
-
- 📖 [API Reference](./docs/API.md)
|
|
646
|
-
-
|
|
647
|
-
-
|
|
648
|
-
- 🤝 [Contributing Guide](./CONTRIBUTING.md) - Contribute to Elit
|
|
811
|
+
- 📚 [Full Documentation](https://github.com/oangsa/elit/docs)
|
|
812
|
+
- ⚡ [Quick Start Guide](./docs/QUICK_START.md)
|
|
813
|
+
- 📖 [API Reference](./docs/API.md)
|
|
814
|
+
- 🔄 [Migration Guide](./docs/MIGRATION.md)
|
|
815
|
+
- 🤝 [Contributing Guide](./CONTRIBUTING.md)
|
|
649
816
|
|
|
650
817
|
## Changelog
|
|
651
818
|
|
|
652
|
-
###
|
|
819
|
+
### Elit - Full-Stack Framework
|
|
820
|
+
|
|
821
|
+
**Major Changes:**
|
|
822
|
+
- 🚀 **Integrated Build System**: Built-in esbuild with automatic client/server code separation
|
|
823
|
+
- 🔥 **CLI Tools**: New commands - `npx elit dev`, `npx elit build`, `npx elit preview`
|
|
824
|
+
- 🏗️ **Zero Config**: Works out of the box with optional `elit.config.mjs`
|
|
825
|
+
- 🌐 **REST API Router**: Server-side routing with full middleware stack
|
|
826
|
+
- 🔄 **Shared State**: Real-time WebSocket state synchronization
|
|
827
|
+
- 🎯 **basePath Support**: Configure base paths for subdirectory deployments
|
|
828
|
+
- 🔐 **Environment Variables**: .env file support with VITE_ prefix
|
|
829
|
+
- 📦 **Gzip Compression**: Automatic compression for production builds
|
|
830
|
+
- 💾 **Cache Headers**: Smart caching for static assets
|
|
831
|
+
- ⚡ **Hot Module Replacement**: Instant development feedback
|
|
653
832
|
|
|
654
833
|
**Core Library:**
|
|
655
|
-
-
|
|
656
|
-
- ⚡
|
|
657
|
-
-
|
|
658
|
-
-
|
|
659
|
-
-
|
|
660
|
-
-
|
|
834
|
+
- 🎯 Ultra lightweight (~10KB gzipped)
|
|
835
|
+
- ⚡ Reactive state management
|
|
836
|
+
- 🎨 CSS-in-JS with CreateStyle
|
|
837
|
+
- 🛣️ Client-side router
|
|
838
|
+
- 📱 Virtual scrolling
|
|
839
|
+
- 🖥️ SSR support
|
|
661
840
|
- 🎭 100+ HTML, SVG, and MathML elements
|
|
662
|
-
- 🔧 Performance utilities
|
|
663
|
-
-
|
|
664
|
-
- 🎮 DOM utility functions
|
|
665
|
-
- 🌐 Shared state integration with @elit/server
|
|
666
|
-
|
|
667
|
-
**New Package - @elit/server v0.1.0:**
|
|
668
|
-
- ⚡ Hot Module Replacement (HMR) with WebSocket
|
|
669
|
-
- 🌐 REST API router with regex-based parameters
|
|
670
|
-
- 🔧 Middleware stack (CORS, logging, error handling, rate limiting, compression, security)
|
|
671
|
-
- 🔄 Real-time shared state synchronization
|
|
672
|
-
- 📊 Built-in WebSocket server
|
|
673
|
-
- 📁 Static file server with MIME type detection
|
|
674
|
-
- 🛠️ CLI tool (`elit-dev`)
|
|
675
|
-
- 🎯 Zero-config with sensible defaults
|
|
841
|
+
- 🔧 Performance utilities
|
|
842
|
+
- 📦 Tree-shakeable ES modules
|
|
676
843
|
|
|
677
844
|
## Examples
|
|
678
845
|
|
|
679
|
-
|
|
846
|
+
Example applications demonstrating Elit features:
|
|
680
847
|
|
|
681
|
-
- **[
|
|
682
|
-
- **[
|
|
683
|
-
- **[
|
|
684
|
-
- **[
|
|
685
|
-
- **[Todo App](./examples)** - Complete todo application (coming soon)
|
|
848
|
+
- 📖 **[Documentation Site](./docs)** - Full-featured docs site with i18n and blog
|
|
849
|
+
- 🎯 **[Counter App](./examples/counter)** - Simple reactive counter
|
|
850
|
+
- ✅ **[Todo App](./examples/todo)** - Todo list with state management
|
|
851
|
+
- 🎨 **[Styled Components](./examples/styled)** - CSS-in-JS examples
|
|
686
852
|
|
|
687
|
-
[View all examples →](./
|
|
853
|
+
[View all examples →](./examples)
|
|
688
854
|
|
|
689
855
|
## Links
|
|
690
856
|
|
|
691
857
|
- 📦 [npm - elit](https://www.npmjs.com/package/elit)
|
|
692
|
-
- 📦 [npm -
|
|
858
|
+
- 📦 [npm - elit-server](https://www.npmjs.com/package/elit-server)
|
|
693
859
|
- 🐙 [GitHub Repository](https://github.com/oangsa/elit)
|
|
694
860
|
- 📚 Documentation (coming soon)
|
|
695
861
|
- 💬 Discord Community (coming soon)
|
package/dist/build.d.mts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { B as BuildOptions, q as BuildResult } from './types-DOAdFFJB.mjs';
|
|
2
|
+
import 'http';
|
|
3
|
+
import 'ws';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Build module for bundling applications
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
declare function build(options: BuildOptions): Promise<BuildResult>;
|
|
10
|
+
|
|
11
|
+
export { BuildOptions, BuildResult, build };
|
package/dist/build.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { B as BuildOptions, q as BuildResult } from './types-DOAdFFJB.js';
|
|
2
|
+
import 'http';
|
|
3
|
+
import 'ws';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Build module for bundling applications
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
declare function build(options: BuildOptions): Promise<BuildResult>;
|
|
10
|
+
|
|
11
|
+
export { BuildOptions, BuildResult, build };
|
package/dist/build.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var e=require("esbuild"),t=require("fs"),o=require("path"),n={outDir:"dist",minify:!0,sourcemap:!1,target:"es2020",format:"esm",treeshake:!0,logging:!0,external:[]};function i(e){if(0===e)return"0 B";let t=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,t)).toFixed(2))+" "+["B","KB","MB","GB"][t]}exports.build=async function(r){let l={...n,...r},s=Date.now();if(!l.entry)throw new Error("Entry file is required");let a=o.resolve(l.entry),c=o.resolve(l.outDir),g=l.outFile;if(!g){g=o.basename(l.entry,o.extname(l.entry))+("cjs"===l.format?".cjs":".js")}let f=o.join(c,g);try{t.mkdirSync(c,{recursive:!0})}catch{}l.logging&&(console.log("\n🔨 Building..."),console.log(` Entry: ${l.entry}`),console.log(` Output: ${f}`),console.log(` Format: ${l.format}`),console.log(` Target: ${l.target}`));let u={name:"browser-only",setup(e){e.onResolve({filter:/^(node:.*|fs|path|http|https|url|os|child_process|net|tls|crypto|stream|util|events|buffer|zlib|readline|process|assert|constants|dns|domain|punycode|querystring|repl|string_decoder|sys|timers|tty|v8|vm)$/},()=>({path:"node-builtin",external:!0,sideEffects:!1})),e.onResolve({filter:/^(chokidar|esbuild|mime-types|open|ws|fs\/promises)$/},()=>({path:"server-dep",external:!0,sideEffects:!1})),e.onLoad({filter:/[\\/](server|config|cli)\.ts$/},()=>({contents:"export {}",loader:"js"}))}};try{let n=l.platform||("cjs"===l.format?"node":"browser"),r="browser"===n?[u]:[],g={};l.env&&(Object.entries(l.env).forEach(([e,t])=>{e.startsWith("VITE_")&&(g[`import.meta.env.${e}`]=JSON.stringify(t))}),l.env.MODE&&(g["import.meta.env.MODE"]=JSON.stringify(l.env.MODE)),g["import.meta.env.DEV"]=JSON.stringify("production"!==l.env.MODE),g["import.meta.env.PROD"]=JSON.stringify("production"===l.env.MODE));let m=await e.build({entryPoints:[a],bundle:!0,outfile:f,format:l.format,target:l.target,minify:l.minify,sourcemap:l.sourcemap,external:l.external,treeShaking:l.treeshake,globalName:l.globalName,platform:n,plugins:r,define:g,logLevel:l.logging?"info":"silent",metafile:!0,...l.minify&&{minifyWhitespace:!0,minifyIdentifiers:!0,minifySyntax:!0,legalComments:"none",mangleProps:/^_/,keepNames:!1}}),p=Date.now()-s,y=t.statSync(f).size;if(l.logging&&(console.log("\n✅ Build successful!"),console.log(` Time: ${p}ms`),console.log(` Size: ${i(y)}`),m.metafile)){let e=Object.keys(m.metafile.inputs).length;console.log(` Files: ${e} input(s)`);let t=Object.keys(m.metafile.outputs);if(t.length>0){let e=m.metafile.outputs[t[0]];if(e&&e.inputs){let t=Object.entries(e.inputs).sort(([,e],[,t])=>t.bytesInOutput-e.bytesInOutput).slice(0,5);t.length>0&&(console.log("\n 📊 Top 5 largest modules:"),t.forEach(([e,t])=>{let o=e.split(/[/\\]/).pop()||e;console.log(` ${o.padEnd(30)} ${i(t.bytesInOutput)}`)}))}}}let d={outputPath:f,buildTime:p,size:y};if(l.copy&&l.copy.length>0){l.logging&&console.log("\n📦 Copying files...");for(let e of l.copy){let n=o.resolve(e.from),i=o.resolve(c,e.to),r=o.dirname(i);if(t.existsSync(r)||t.mkdirSync(r,{recursive:!0}),t.existsSync(n)){if(e.transform){let o=t.readFileSync(n,"utf-8"),r=e.transform(o,l);t.writeFileSync(i,r)}else t.copyFileSync(n,i);l.logging&&console.log(` ✓ ${e.from} → ${e.to}`)}else l.logging&&console.warn(` ⚠ File not found: ${e.from}`)}}return l.onBuildEnd&&await l.onBuildEnd(d),l.logging&&console.log(""),d}catch(e){throw l.logging&&(console.error("\n❌ Build failed:"),console.error(e)),e}};
|
package/dist/build.mjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{build as e}from"esbuild";import{mkdirSync as t,statSync as o,existsSync as n,readFileSync as r,writeFileSync as i,copyFileSync as l}from"fs";import{resolve as s,basename as a,extname as f,join as g,dirname as m}from"path";var c={outDir:"dist",minify:!0,sourcemap:!1,target:"es2020",format:"esm",treeshake:!0,logging:!0,external:[]};async function p(p){let d={...c,...p},y=Date.now();if(!d.entry)throw new Error("Entry file is required");let h=s(d.entry),v=s(d.outDir),b=d.outFile;if(!b){b=a(d.entry,f(d.entry))+("cjs"===d.format?".cjs":".js")}let O=g(v,b);try{t(v,{recursive:!0})}catch{}d.logging&&(console.log("\n🔨 Building..."),console.log(` Entry: ${d.entry}`),console.log(` Output: ${O}`),console.log(` Format: ${d.format}`),console.log(` Target: ${d.target}`));let E={name:"browser-only",setup(e){e.onResolve({filter:/^(node:.*|fs|path|http|https|url|os|child_process|net|tls|crypto|stream|util|events|buffer|zlib|readline|process|assert|constants|dns|domain|punycode|querystring|repl|string_decoder|sys|timers|tty|v8|vm)$/},()=>({path:"node-builtin",external:!0,sideEffects:!1})),e.onResolve({filter:/^(chokidar|esbuild|mime-types|open|ws|fs\/promises)$/},()=>({path:"server-dep",external:!0,sideEffects:!1})),e.onLoad({filter:/[\\/](server|config|cli)\.ts$/},()=>({contents:"export {}",loader:"js"}))}};try{let a=d.platform||("cjs"===d.format?"node":"browser"),f="browser"===a?[E]:[],g={};d.env&&(Object.entries(d.env).forEach(([e,t])=>{e.startsWith("VITE_")&&(g[`import.meta.env.${e}`]=JSON.stringify(t))}),d.env.MODE&&(g["import.meta.env.MODE"]=JSON.stringify(d.env.MODE)),g["import.meta.env.DEV"]=JSON.stringify("production"!==d.env.MODE),g["import.meta.env.PROD"]=JSON.stringify("production"===d.env.MODE));let c=await e({entryPoints:[h],bundle:!0,outfile:O,format:d.format,target:d.target,minify:d.minify,sourcemap:d.sourcemap,external:d.external,treeShaking:d.treeshake,globalName:d.globalName,platform:a,plugins:f,define:g,logLevel:d.logging?"info":"silent",metafile:!0,...d.minify&&{minifyWhitespace:!0,minifyIdentifiers:!0,minifySyntax:!0,legalComments:"none",mangleProps:/^_/,keepNames:!1}}),p=Date.now()-y,b=o(O).size;if(d.logging&&(console.log("\n✅ Build successful!"),console.log(` Time: ${p}ms`),console.log(` Size: ${u(b)}`),c.metafile)){let e=Object.keys(c.metafile.inputs).length;console.log(` Files: ${e} input(s)`);let t=Object.keys(c.metafile.outputs);if(t.length>0){let e=c.metafile.outputs[t[0]];if(e&&e.inputs){let t=Object.entries(e.inputs).sort(([,e],[,t])=>t.bytesInOutput-e.bytesInOutput).slice(0,5);t.length>0&&(console.log("\n 📊 Top 5 largest modules:"),t.forEach(([e,t])=>{let o=e.split(/[/\\]/).pop()||e;console.log(` ${o.padEnd(30)} ${u(t.bytesInOutput)}`)}))}}}let $={outputPath:O,buildTime:p,size:b};if(d.copy&&d.copy.length>0){d.logging&&console.log("\n📦 Copying files...");for(let e of d.copy){let o=s(e.from),a=s(v,e.to),f=m(a);if(n(f)||t(f,{recursive:!0}),n(o)){if(e.transform){let t=r(o,"utf-8"),n=e.transform(t,d);i(a,n)}else l(o,a);d.logging&&console.log(` ✓ ${e.from} → ${e.to}`)}else d.logging&&console.warn(` ⚠ File not found: ${e.from}`)}}return d.onBuildEnd&&await d.onBuildEnd($),d.logging&&console.log(""),$}catch(e){throw d.logging&&(console.error("\n❌ Build failed:"),console.error(e)),e}}function u(e){if(0===e)return"0 B";let t=Math.floor(Math.log(e)/Math.log(1024));return parseFloat((e/Math.pow(1024,t)).toFixed(2))+" "+["B","KB","MB","GB"][t]}export{p as build};
|