makepack 1.7.15 → 1.7.17
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 +365 -365
- package/package.json +62 -62
- package/src/actions/build/bundler.js +220 -132
- package/src/actions/build/index.js +79 -75
- package/src/actions/create/files/gitignore.js +9 -9
- package/src/actions/create/files/main.js +36 -36
- package/src/actions/create/files/package-json.js +49 -49
- package/src/actions/create/files/project-js.js +12 -12
- package/src/actions/create/files/project-jsx.js +50 -50
- package/src/actions/create/files/project-ts.js +10 -10
- package/src/actions/create/files/project-tsx.js +50 -50
- package/src/actions/create/files/readme.md.js +62 -62
- package/src/actions/create/files/tsconfig.js +33 -33
- package/src/actions/create/index.js +95 -95
- package/src/actions/create/makeFiles.js +65 -65
- package/src/actions/release/index.js +19 -19
- package/src/actions/start/index.js +215 -215
- package/src/actions/start/vite.js +72 -72
- package/src/helpers.js +120 -120
- package/src/index.js +39 -39
package/README.md
CHANGED
|
@@ -1,365 +1,365 @@
|
|
|
1
|
-
<div align="center">
|
|
2
|
-
|
|
3
|
-
<img src="./logo.png" alt="makepack" width="90"/>
|
|
4
|
-
|
|
5
|
-
# makepack
|
|
6
|
-
|
|
7
|
-
<strong>A zero‑config (yet configurable) CLI to scaffold, develop, build, and publish modern JavaScript / TypeScript / React libraries.</strong>
|
|
8
|
-
|
|
9
|
-
<p>
|
|
10
|
-
Create a production‑ready npm package in seconds: pick a template, start a hot‑reloading dev server, bundle to ESM + CJS (and optionally a single bundle), generate type declarations, and publish – all with one tool.
|
|
11
|
-
</p>
|
|
12
|
-
|
|
13
|
-
<p>
|
|
14
|
-
<!-- Badges (add/adjust once published on npm) -->
|
|
15
|
-
<a href="https://www.npmjs.com/package/makepack"><img src="https://img.shields.io/npm/v/makepack?color=3B82F6" alt="npm version"/></a>
|
|
16
|
-
<a href="https://github.com/devnax/makepack/actions"><img src="https://img.shields.io/badge/build-passing-brightgreen" alt="build"/></a>
|
|
17
|
-
<a href="https://github.com/devnax/makepack/issues"><img src="https://img.shields.io/github/issues/devnax/makepack" alt="issues"/></a>
|
|
18
|
-
<a href="#license"><img src="https://img.shields.io/badge/license-TBD-lightgrey" alt="license"/></a>
|
|
19
|
-
</p>
|
|
20
|
-
|
|
21
|
-
</div>
|
|
22
|
-
|
|
23
|
-
---
|
|
24
|
-
|
|
25
|
-
## ✨ Features
|
|
26
|
-
|
|
27
|
-
- Rapid project creation with four templates:
|
|
28
|
-
- TypeScript library
|
|
29
|
-
- JavaScript library
|
|
30
|
-
- React + TypeScript component library
|
|
31
|
-
- React + JavaScript component library
|
|
32
|
-
- Development server with hot reload + optional Express middleware (`express.ts` / `express.js`)
|
|
33
|
-
- Automatic dependency graph tracking (via `madge`) for efficient reloads
|
|
34
|
-
- Incremental TypeScript compilation and declaration output
|
|
35
|
-
- Dual module build (`esm`, `cjs`, or both) with optional single bundled file
|
|
36
|
-
- Tree‑shaken and optionally minified output
|
|
37
|
-
- Sourcemaps & type declarations by default
|
|
38
|
-
- Clean build output in an isolated `.mpack` directory (publish‑ready)
|
|
39
|
-
- Simple release workflow (`makepack release` or `npm run release` guidance)
|
|
40
|
-
|
|
41
|
-
---
|
|
42
|
-
|
|
43
|
-
## 🚀 Quick Start
|
|
44
|
-
|
|
45
|
-
Install globally (recommended) or use `npx`.
|
|
46
|
-
|
|
47
|
-
```bash
|
|
48
|
-
npm install -g makepack # global
|
|
49
|
-
# or
|
|
50
|
-
npx makepack create # without global install
|
|
51
|
-
```
|
|
52
|
-
|
|
53
|
-
Create a new project:
|
|
54
|
-
|
|
55
|
-
```bash
|
|
56
|
-
makepack create
|
|
57
|
-
# Answer the interactive prompts:
|
|
58
|
-
# - Project name
|
|
59
|
-
# - Template
|
|
60
|
-
```
|
|
61
|
-
|
|
62
|
-
Enter the project (if created in a new folder) and start the dev server:
|
|
63
|
-
|
|
64
|
-
```bash
|
|
65
|
-
cd your-project
|
|
66
|
-
npm start
|
|
67
|
-
```
|
|
68
|
-
|
|
69
|
-
Build the library:
|
|
70
|
-
|
|
71
|
-
```bash
|
|
72
|
-
makepack build
|
|
73
|
-
```
|
|
74
|
-
|
|
75
|
-
Release (after building):
|
|
76
|
-
|
|
77
|
-
```bash
|
|
78
|
-
makepack release # publishes the contents of ./.mpack to npm
|
|
79
|
-
```
|
|
80
|
-
|
|
81
|
-
> Tip: You can also run via package scripts (auto‑generated or added manually): `npm run build` / `npm run start`.
|
|
82
|
-
|
|
83
|
-
---
|
|
84
|
-
|
|
85
|
-
## 📦 Generated Project Structure
|
|
86
|
-
|
|
87
|
-
Depending on template, you’ll get something like:
|
|
88
|
-
|
|
89
|
-
```
|
|
90
|
-
your-lib/
|
|
91
|
-
package.json
|
|
92
|
-
readme.md
|
|
93
|
-
tsconfig.json (TypeScript templates)
|
|
94
|
-
src/
|
|
95
|
-
index.(ts|js|tsx|jsx)
|
|
96
|
-
(React templates include an example component + export)
|
|
97
|
-
```
|
|
98
|
-
|
|
99
|
-
During development/build:
|
|
100
|
-
|
|
101
|
-
```
|
|
102
|
-
.mpack/ # Build output (cleaned & regenerated each build)
|
|
103
|
-
package.json # Stripped (scripts & "type" removed for publishing clarity)
|
|
104
|
-
readme.md
|
|
105
|
-
dist files # ESM/CJS outputs + declarations + sourcemaps
|
|
106
|
-
```
|
|
107
|
-
|
|
108
|
-
> Do not edit files inside `.mpack` directly. Treat it as a disposable publish directory.
|
|
109
|
-
|
|
110
|
-
---
|
|
111
|
-
|
|
112
|
-
## 🧪 Development Server
|
|
113
|
-
|
|
114
|
-
Run: `makepack start --port 3000`
|
|
115
|
-
|
|
116
|
-
Features:
|
|
117
|
-
- Hot reload on dependency change
|
|
118
|
-
- Optional custom Express bootstrap via a root `express.ts` or `express.js` exporting a default function `(app) => { ... }`
|
|
119
|
-
- Safe handler wrapping to catch async errors
|
|
120
|
-
|
|
121
|
-
Example `express.ts`:
|
|
122
|
-
|
|
123
|
-
```ts
|
|
124
|
-
import { Express } from 'express';
|
|
125
|
-
|
|
126
|
-
export default function routes(app: Express) {
|
|
127
|
-
app.get('/health', (_req, res) => {
|
|
128
|
-
res.json({ ok: true, ts: Date.now() });
|
|
129
|
-
});
|
|
130
|
-
}
|
|
131
|
-
```
|
|
132
|
-
|
|
133
|
-
If present, it’s reloaded automatically when edited.
|
|
134
|
-
|
|
135
|
-
---
|
|
136
|
-
|
|
137
|
-
## 🏗 Build System
|
|
138
|
-
|
|
139
|
-
Command:
|
|
140
|
-
|
|
141
|
-
```bash
|
|
142
|
-
makepack build [options]
|
|
143
|
-
```
|
|
144
|
-
|
|
145
|
-
| Option | Default | Values | Description |
|
|
146
|
-
| ---------------------- | ------- | -------------------- | --------------------------------------------------- |
|
|
147
|
-
| `--format` / `-f` | `both` | `cjs`, `esm`, `both` | Module formats to output |
|
|
148
|
-
| `--bundle` / `-b` | `false` | `true/false` | Bundle into a single file (rollup/esbuild assisted) |
|
|
149
|
-
| `--minify` / `-m` | `false` | `true/false` | Minify output (Terser) |
|
|
150
|
-
| `--sourcemap` / `-s` | `true` | `true/false` | Emit source maps |
|
|
151
|
-
| `--declaration` / `-d` | `true` | `true/false` | Emit TypeScript `.d.ts` files |
|
|
152
|
-
|
|
153
|
-
Behavior notes:
|
|
154
|
-
- The tool auto‑detects `src/index.(ts|js|tsx|jsx)` as the entry.
|
|
155
|
-
- Boolean flags accept either actual booleans or string equivalents: `--minify=true`.
|
|
156
|
-
- Output is always placed in `.mpack/` (cleaned each run).
|
|
157
|
-
- `package.json` in output has `scripts` and `type` removed for neutral publishing.
|
|
158
|
-
|
|
159
|
-
### Example Builds
|
|
160
|
-
|
|
161
|
-
Dual build with declarations (default):
|
|
162
|
-
|
|
163
|
-
```bash
|
|
164
|
-
makepack build
|
|
165
|
-
```
|
|
166
|
-
|
|
167
|
-
ESM only, minified, bundled:
|
|
168
|
-
|
|
169
|
-
```bash
|
|
170
|
-
makepack build --format=esm --bundle=true --minify=true
|
|
171
|
-
```
|
|
172
|
-
|
|
173
|
-
Disable sourcemaps & declarations (faster):
|
|
174
|
-
|
|
175
|
-
```bash
|
|
176
|
-
makepack build -s=false -d=false
|
|
177
|
-
```
|
|
178
|
-
|
|
179
|
-
---
|
|
180
|
-
|
|
181
|
-
## 🚢 Releasing
|
|
182
|
-
|
|
183
|
-
1. Ensure you are logged in to npm: `npm login`
|
|
184
|
-
2. Build your package: `makepack build`
|
|
185
|
-
3. Publish from the generated directory:
|
|
186
|
-
- Quick command: `makepack release`
|
|
187
|
-
- Manual: `cd .mpack && npm publish`
|
|
188
|
-
|
|
189
|
-
> The release command simply runs `npm publish` inside `.mpack` after verifying a build exists.
|
|
190
|
-
|
|
191
|
-
---
|
|
192
|
-
|
|
193
|
-
## 🔌 Express Integration (Optional)
|
|
194
|
-
|
|
195
|
-
Add `express.ts` or `express.js` in the project root. Export a default function receiving the Express `app`. Example with middleware:
|
|
196
|
-
|
|
197
|
-
```ts
|
|
198
|
-
import compression from 'compression';
|
|
199
|
-
|
|
200
|
-
export default function(app) {
|
|
201
|
-
app.use(compression());
|
|
202
|
-
app.get('/', (_req, res) => res.send('Hello from makepack dev server'));
|
|
203
|
-
}
|
|
204
|
-
```
|
|
205
|
-
|
|
206
|
-
The file and all its dependency graph (resolved via `madge`) are watched; edits trigger a reload.
|
|
207
|
-
|
|
208
|
-
---
|
|
209
|
-
|
|
210
|
-
## 🧬 Technology Stack
|
|
211
|
-
|
|
212
|
-
| Area | Tooling |
|
|
213
|
-
| ---------- | ---------------------------------------------------------------------- |
|
|
214
|
-
| CLI | `commander` |
|
|
215
|
-
| Dev Server | `express`, `vite`, `chokidar`, `madge` |
|
|
216
|
-
| Builds | `rollup`, `@rollup/plugin-*`, `esbuild`, `rollup-plugin-dts`, `terser` |
|
|
217
|
-
| UX | `inquirer`, `ora` |
|
|
218
|
-
| FS/Utils | `fs-extra`, `lodash.debounce` |
|
|
219
|
-
|
|
220
|
-
---
|
|
221
|
-
|
|
222
|
-
## 🛠 Templates Overview
|
|
223
|
-
|
|
224
|
-
| Template | Use Case | Entry | Extras |
|
|
225
|
-
| ----------------------- | ----------------------------- | --------------- | ------------------- |
|
|
226
|
-
| `typescript` | Library in TypeScript | `src/index.ts` | `tsconfig.json` |
|
|
227
|
-
| `javascript` | Plain JS library | `src/index.js` | – |
|
|
228
|
-
| `react with typescript` | React component library (TSX) | `src/index.tsx` | React + types setup |
|
|
229
|
-
| `react with javascript` | React component library (JSX) | `src/index.jsx` | React setup |
|
|
230
|
-
|
|
231
|
-
Generated React templates export a sample component you can replace.
|
|
232
|
-
|
|
233
|
-
---
|
|
234
|
-
|
|
235
|
-
## 🔄 Lifecycle Summary
|
|
236
|
-
|
|
237
|
-
1. `create` → scaffold + install deps
|
|
238
|
-
2. `start` → hot dev (optionally with express middleware)
|
|
239
|
-
3. `build` → produce distributable code in `.mpack`
|
|
240
|
-
4. `release` → publish the build to npm
|
|
241
|
-
|
|
242
|
-
---
|
|
243
|
-
|
|
244
|
-
## 📘 Command Reference
|
|
245
|
-
|
|
246
|
-
```bash
|
|
247
|
-
makepack create # Interactive project scaffolding
|
|
248
|
-
makepack start --port 4000 # Start dev server on custom port
|
|
249
|
-
makepack build [flags] # Build library
|
|
250
|
-
makepack release # Publish from .mpack
|
|
251
|
-
```
|
|
252
|
-
|
|
253
|
-
See build flags in the [Build System](#-build-system) section.
|
|
254
|
-
|
|
255
|
-
---
|
|
256
|
-
|
|
257
|
-
## 🧩 Using From `package.json`
|
|
258
|
-
|
|
259
|
-
You can wire scripts (some templates already do this):
|
|
260
|
-
|
|
261
|
-
```jsonc
|
|
262
|
-
{
|
|
263
|
-
"scripts": {
|
|
264
|
-
"start": "makepack start --port 3000",
|
|
265
|
-
"build": "makepack build",
|
|
266
|
-
"release": "makepack release"
|
|
267
|
-
}
|
|
268
|
-
}
|
|
269
|
-
```
|
|
270
|
-
|
|
271
|
-
Run with `npm run build` etc.
|
|
272
|
-
|
|
273
|
-
---
|
|
274
|
-
|
|
275
|
-
## 🧷 Best Practices
|
|
276
|
-
|
|
277
|
-
- Keep a clean root: limit extra build artifacts outside `src/`.
|
|
278
|
-
- Export your public API from a single `src/index.*`.
|
|
279
|
-
- Use semantic versioning (e.g. `npm version patch`).
|
|
280
|
-
- For React libraries, avoid bundling peer deps – list `react` & `react-dom` as `peerDependencies` in your own `package.json` before publishing.
|
|
281
|
-
- Add a LICENSE file (see below) – required for many consumers.
|
|
282
|
-
|
|
283
|
-
---
|
|
284
|
-
|
|
285
|
-
## 🐞 Troubleshooting
|
|
286
|
-
|
|
287
|
-
| Issue | Cause | Fix |
|
|
288
|
-
| --------------------- | ------------------------------------ | ----------------------------------------------------------------------- |
|
|
289
|
-
| "No entry file found" | Missing `src/index.*` | Create `src/index.ts` or equivalent |
|
|
290
|
-
| Express not reloading | File outside dependency graph | Import files directly from `express.(ts | js)` |
|
|
291
|
-
| Declarations missing | `--declaration=false` or JS template | Use TS template or enable flag |
|
|
292
|
-
| Publish fails | Not built | Run `makepack build` first |
|
|
293
|
-
| ESM import errors | Missing `"type": "module"` in root | Add `type` back in your source project (it’s stripped only in `.mpack`) |
|
|
294
|
-
|
|
295
|
-
---
|
|
296
|
-
|
|
297
|
-
## 🤝 Contributing
|
|
298
|
-
|
|
299
|
-
Contributions welcome! Suggested flow:
|
|
300
|
-
|
|
301
|
-
1. Fork & clone
|
|
302
|
-
2. Create a feature branch: `git checkout -b feat/your-idea`
|
|
303
|
-
3. Implement + add/update docs
|
|
304
|
-
4. Commit with conventional style: `feat(build): add xyz`
|
|
305
|
-
5. Open a PR
|
|
306
|
-
|
|
307
|
-
Please include clear reproduction steps for any bug fix.
|
|
308
|
-
|
|
309
|
-
### Future Ideas (Open for PRs)
|
|
310
|
-
- Plugin system for custom build steps
|
|
311
|
-
- Peer dependency auto‑detection
|
|
312
|
-
- Template customization presets
|
|
313
|
-
- E2E test harness
|
|
314
|
-
|
|
315
|
-
---
|
|
316
|
-
|
|
317
|
-
## 🔐 Security
|
|
318
|
-
|
|
319
|
-
No network calls are performed beyond npm install/publish and user code execution. Always audit generated dependencies before publishing.
|
|
320
|
-
|
|
321
|
-
Report vulnerabilities via GitHub Issues (consider labeling as `security`). Avoid posting exploit details publicly – request a private channel if needed.
|
|
322
|
-
|
|
323
|
-
---
|
|
324
|
-
|
|
325
|
-
## 📄 License
|
|
326
|
-
|
|
327
|
-
License: **TBD** (e.g. MIT). Add a `LICENSE` file such as:
|
|
328
|
-
|
|
329
|
-
```text
|
|
330
|
-
MIT License
|
|
331
|
-
Copyright (c) 2025 Devnax
|
|
332
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy...
|
|
333
|
-
```
|
|
334
|
-
|
|
335
|
-
---
|
|
336
|
-
|
|
337
|
-
## 🙋 FAQ
|
|
338
|
-
|
|
339
|
-
**Why strip `scripts` and `type` from the published package.json?**
|
|
340
|
-
To minimize accidental exposure of internal scripts and to keep the distributed package neutral; consumers rarely need them.
|
|
341
|
-
|
|
342
|
-
**Can I output only one format?**
|
|
343
|
-
Yes: `--format=esm` or `--format=cjs`.
|
|
344
|
-
|
|
345
|
-
**How do I include assets (e.g. CSS)?**
|
|
346
|
-
Import them from your entry; configure rollup/esbuild plugins in future versions (PRs welcome) – currently you’d manually copy in a post-step.
|
|
347
|
-
|
|
348
|
-
**Does it support monorepos?**
|
|
349
|
-
Not natively; you can still run it per package folder.
|
|
350
|
-
|
|
351
|
-
**Why another tool?**
|
|
352
|
-
To reduce the ceremony of picking + wiring rollup, tsconfig, scripts, vite dev preview, express hooks, and publish layout – all unified.
|
|
353
|
-
|
|
354
|
-
---
|
|
355
|
-
|
|
356
|
-
## 📬 Support
|
|
357
|
-
|
|
358
|
-
Open an issue for bugs, ideas, or questions: https://github.com/devnax/makepack/issues
|
|
359
|
-
|
|
360
|
-
---
|
|
361
|
-
|
|
362
|
-
<div align="center">
|
|
363
|
-
<sub>Built with ❤️ to streamline modern package creation.</sub>
|
|
364
|
-
</div>
|
|
365
|
-
|
|
1
|
+
<div align="center">
|
|
2
|
+
|
|
3
|
+
<img src="./logo.png" alt="makepack" width="90"/>
|
|
4
|
+
|
|
5
|
+
# makepack
|
|
6
|
+
|
|
7
|
+
<strong>A zero‑config (yet configurable) CLI to scaffold, develop, build, and publish modern JavaScript / TypeScript / React libraries.</strong>
|
|
8
|
+
|
|
9
|
+
<p>
|
|
10
|
+
Create a production‑ready npm package in seconds: pick a template, start a hot‑reloading dev server, bundle to ESM + CJS (and optionally a single bundle), generate type declarations, and publish – all with one tool.
|
|
11
|
+
</p>
|
|
12
|
+
|
|
13
|
+
<p>
|
|
14
|
+
<!-- Badges (add/adjust once published on npm) -->
|
|
15
|
+
<a href="https://www.npmjs.com/package/makepack"><img src="https://img.shields.io/npm/v/makepack?color=3B82F6" alt="npm version"/></a>
|
|
16
|
+
<a href="https://github.com/devnax/makepack/actions"><img src="https://img.shields.io/badge/build-passing-brightgreen" alt="build"/></a>
|
|
17
|
+
<a href="https://github.com/devnax/makepack/issues"><img src="https://img.shields.io/github/issues/devnax/makepack" alt="issues"/></a>
|
|
18
|
+
<a href="#license"><img src="https://img.shields.io/badge/license-TBD-lightgrey" alt="license"/></a>
|
|
19
|
+
</p>
|
|
20
|
+
|
|
21
|
+
</div>
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
25
|
+
## ✨ Features
|
|
26
|
+
|
|
27
|
+
- Rapid project creation with four templates:
|
|
28
|
+
- TypeScript library
|
|
29
|
+
- JavaScript library
|
|
30
|
+
- React + TypeScript component library
|
|
31
|
+
- React + JavaScript component library
|
|
32
|
+
- Development server with hot reload + optional Express middleware (`express.ts` / `express.js`)
|
|
33
|
+
- Automatic dependency graph tracking (via `madge`) for efficient reloads
|
|
34
|
+
- Incremental TypeScript compilation and declaration output
|
|
35
|
+
- Dual module build (`esm`, `cjs`, or both) with optional single bundled file
|
|
36
|
+
- Tree‑shaken and optionally minified output
|
|
37
|
+
- Sourcemaps & type declarations by default
|
|
38
|
+
- Clean build output in an isolated `.mpack` directory (publish‑ready)
|
|
39
|
+
- Simple release workflow (`makepack release` or `npm run release` guidance)
|
|
40
|
+
|
|
41
|
+
---
|
|
42
|
+
|
|
43
|
+
## 🚀 Quick Start
|
|
44
|
+
|
|
45
|
+
Install globally (recommended) or use `npx`.
|
|
46
|
+
|
|
47
|
+
```bash
|
|
48
|
+
npm install -g makepack # global
|
|
49
|
+
# or
|
|
50
|
+
npx makepack create # without global install
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Create a new project:
|
|
54
|
+
|
|
55
|
+
```bash
|
|
56
|
+
makepack create
|
|
57
|
+
# Answer the interactive prompts:
|
|
58
|
+
# - Project name
|
|
59
|
+
# - Template
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
Enter the project (if created in a new folder) and start the dev server:
|
|
63
|
+
|
|
64
|
+
```bash
|
|
65
|
+
cd your-project
|
|
66
|
+
npm start
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
Build the library:
|
|
70
|
+
|
|
71
|
+
```bash
|
|
72
|
+
makepack build
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
Release (after building):
|
|
76
|
+
|
|
77
|
+
```bash
|
|
78
|
+
makepack release # publishes the contents of ./.mpack to npm
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
> Tip: You can also run via package scripts (auto‑generated or added manually): `npm run build` / `npm run start`.
|
|
82
|
+
|
|
83
|
+
---
|
|
84
|
+
|
|
85
|
+
## 📦 Generated Project Structure
|
|
86
|
+
|
|
87
|
+
Depending on template, you’ll get something like:
|
|
88
|
+
|
|
89
|
+
```
|
|
90
|
+
your-lib/
|
|
91
|
+
package.json
|
|
92
|
+
readme.md
|
|
93
|
+
tsconfig.json (TypeScript templates)
|
|
94
|
+
src/
|
|
95
|
+
index.(ts|js|tsx|jsx)
|
|
96
|
+
(React templates include an example component + export)
|
|
97
|
+
```
|
|
98
|
+
|
|
99
|
+
During development/build:
|
|
100
|
+
|
|
101
|
+
```
|
|
102
|
+
.mpack/ # Build output (cleaned & regenerated each build)
|
|
103
|
+
package.json # Stripped (scripts & "type" removed for publishing clarity)
|
|
104
|
+
readme.md
|
|
105
|
+
dist files # ESM/CJS outputs + declarations + sourcemaps
|
|
106
|
+
```
|
|
107
|
+
|
|
108
|
+
> Do not edit files inside `.mpack` directly. Treat it as a disposable publish directory.
|
|
109
|
+
|
|
110
|
+
---
|
|
111
|
+
|
|
112
|
+
## 🧪 Development Server
|
|
113
|
+
|
|
114
|
+
Run: `makepack start --port 3000`
|
|
115
|
+
|
|
116
|
+
Features:
|
|
117
|
+
- Hot reload on dependency change
|
|
118
|
+
- Optional custom Express bootstrap via a root `express.ts` or `express.js` exporting a default function `(app) => { ... }`
|
|
119
|
+
- Safe handler wrapping to catch async errors
|
|
120
|
+
|
|
121
|
+
Example `express.ts`:
|
|
122
|
+
|
|
123
|
+
```ts
|
|
124
|
+
import { Express } from 'express';
|
|
125
|
+
|
|
126
|
+
export default function routes(app: Express) {
|
|
127
|
+
app.get('/health', (_req, res) => {
|
|
128
|
+
res.json({ ok: true, ts: Date.now() });
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
```
|
|
132
|
+
|
|
133
|
+
If present, it’s reloaded automatically when edited.
|
|
134
|
+
|
|
135
|
+
---
|
|
136
|
+
|
|
137
|
+
## 🏗 Build System
|
|
138
|
+
|
|
139
|
+
Command:
|
|
140
|
+
|
|
141
|
+
```bash
|
|
142
|
+
makepack build [options]
|
|
143
|
+
```
|
|
144
|
+
|
|
145
|
+
| Option | Default | Values | Description |
|
|
146
|
+
| ---------------------- | ------- | -------------------- | --------------------------------------------------- |
|
|
147
|
+
| `--format` / `-f` | `both` | `cjs`, `esm`, `both` | Module formats to output |
|
|
148
|
+
| `--bundle` / `-b` | `false` | `true/false` | Bundle into a single file (rollup/esbuild assisted) |
|
|
149
|
+
| `--minify` / `-m` | `false` | `true/false` | Minify output (Terser) |
|
|
150
|
+
| `--sourcemap` / `-s` | `true` | `true/false` | Emit source maps |
|
|
151
|
+
| `--declaration` / `-d` | `true` | `true/false` | Emit TypeScript `.d.ts` files |
|
|
152
|
+
|
|
153
|
+
Behavior notes:
|
|
154
|
+
- The tool auto‑detects `src/index.(ts|js|tsx|jsx)` as the entry.
|
|
155
|
+
- Boolean flags accept either actual booleans or string equivalents: `--minify=true`.
|
|
156
|
+
- Output is always placed in `.mpack/` (cleaned each run).
|
|
157
|
+
- `package.json` in output has `scripts` and `type` removed for neutral publishing.
|
|
158
|
+
|
|
159
|
+
### Example Builds
|
|
160
|
+
|
|
161
|
+
Dual build with declarations (default):
|
|
162
|
+
|
|
163
|
+
```bash
|
|
164
|
+
makepack build
|
|
165
|
+
```
|
|
166
|
+
|
|
167
|
+
ESM only, minified, bundled:
|
|
168
|
+
|
|
169
|
+
```bash
|
|
170
|
+
makepack build --format=esm --bundle=true --minify=true
|
|
171
|
+
```
|
|
172
|
+
|
|
173
|
+
Disable sourcemaps & declarations (faster):
|
|
174
|
+
|
|
175
|
+
```bash
|
|
176
|
+
makepack build -s=false -d=false
|
|
177
|
+
```
|
|
178
|
+
|
|
179
|
+
---
|
|
180
|
+
|
|
181
|
+
## 🚢 Releasing
|
|
182
|
+
|
|
183
|
+
1. Ensure you are logged in to npm: `npm login`
|
|
184
|
+
2. Build your package: `makepack build`
|
|
185
|
+
3. Publish from the generated directory:
|
|
186
|
+
- Quick command: `makepack release`
|
|
187
|
+
- Manual: `cd .mpack && npm publish`
|
|
188
|
+
|
|
189
|
+
> The release command simply runs `npm publish` inside `.mpack` after verifying a build exists.
|
|
190
|
+
|
|
191
|
+
---
|
|
192
|
+
|
|
193
|
+
## 🔌 Express Integration (Optional)
|
|
194
|
+
|
|
195
|
+
Add `express.ts` or `express.js` in the project root. Export a default function receiving the Express `app`. Example with middleware:
|
|
196
|
+
|
|
197
|
+
```ts
|
|
198
|
+
import compression from 'compression';
|
|
199
|
+
|
|
200
|
+
export default function(app) {
|
|
201
|
+
app.use(compression());
|
|
202
|
+
app.get('/', (_req, res) => res.send('Hello from makepack dev server'));
|
|
203
|
+
}
|
|
204
|
+
```
|
|
205
|
+
|
|
206
|
+
The file and all its dependency graph (resolved via `madge`) are watched; edits trigger a reload.
|
|
207
|
+
|
|
208
|
+
---
|
|
209
|
+
|
|
210
|
+
## 🧬 Technology Stack
|
|
211
|
+
|
|
212
|
+
| Area | Tooling |
|
|
213
|
+
| ---------- | ---------------------------------------------------------------------- |
|
|
214
|
+
| CLI | `commander` |
|
|
215
|
+
| Dev Server | `express`, `vite`, `chokidar`, `madge` |
|
|
216
|
+
| Builds | `rollup`, `@rollup/plugin-*`, `esbuild`, `rollup-plugin-dts`, `terser` |
|
|
217
|
+
| UX | `inquirer`, `ora` |
|
|
218
|
+
| FS/Utils | `fs-extra`, `lodash.debounce` |
|
|
219
|
+
|
|
220
|
+
---
|
|
221
|
+
|
|
222
|
+
## 🛠 Templates Overview
|
|
223
|
+
|
|
224
|
+
| Template | Use Case | Entry | Extras |
|
|
225
|
+
| ----------------------- | ----------------------------- | --------------- | ------------------- |
|
|
226
|
+
| `typescript` | Library in TypeScript | `src/index.ts` | `tsconfig.json` |
|
|
227
|
+
| `javascript` | Plain JS library | `src/index.js` | – |
|
|
228
|
+
| `react with typescript` | React component library (TSX) | `src/index.tsx` | React + types setup |
|
|
229
|
+
| `react with javascript` | React component library (JSX) | `src/index.jsx` | React setup |
|
|
230
|
+
|
|
231
|
+
Generated React templates export a sample component you can replace.
|
|
232
|
+
|
|
233
|
+
---
|
|
234
|
+
|
|
235
|
+
## 🔄 Lifecycle Summary
|
|
236
|
+
|
|
237
|
+
1. `create` → scaffold + install deps
|
|
238
|
+
2. `start` → hot dev (optionally with express middleware)
|
|
239
|
+
3. `build` → produce distributable code in `.mpack`
|
|
240
|
+
4. `release` → publish the build to npm
|
|
241
|
+
|
|
242
|
+
---
|
|
243
|
+
|
|
244
|
+
## 📘 Command Reference
|
|
245
|
+
|
|
246
|
+
```bash
|
|
247
|
+
makepack create # Interactive project scaffolding
|
|
248
|
+
makepack start --port 4000 # Start dev server on custom port
|
|
249
|
+
makepack build [flags] # Build library
|
|
250
|
+
makepack release # Publish from .mpack
|
|
251
|
+
```
|
|
252
|
+
|
|
253
|
+
See build flags in the [Build System](#-build-system) section.
|
|
254
|
+
|
|
255
|
+
---
|
|
256
|
+
|
|
257
|
+
## 🧩 Using From `package.json`
|
|
258
|
+
|
|
259
|
+
You can wire scripts (some templates already do this):
|
|
260
|
+
|
|
261
|
+
```jsonc
|
|
262
|
+
{
|
|
263
|
+
"scripts": {
|
|
264
|
+
"start": "makepack start --port 3000",
|
|
265
|
+
"build": "makepack build",
|
|
266
|
+
"release": "makepack release"
|
|
267
|
+
}
|
|
268
|
+
}
|
|
269
|
+
```
|
|
270
|
+
|
|
271
|
+
Run with `npm run build` etc.
|
|
272
|
+
|
|
273
|
+
---
|
|
274
|
+
|
|
275
|
+
## 🧷 Best Practices
|
|
276
|
+
|
|
277
|
+
- Keep a clean root: limit extra build artifacts outside `src/`.
|
|
278
|
+
- Export your public API from a single `src/index.*`.
|
|
279
|
+
- Use semantic versioning (e.g. `npm version patch`).
|
|
280
|
+
- For React libraries, avoid bundling peer deps – list `react` & `react-dom` as `peerDependencies` in your own `package.json` before publishing.
|
|
281
|
+
- Add a LICENSE file (see below) – required for many consumers.
|
|
282
|
+
|
|
283
|
+
---
|
|
284
|
+
|
|
285
|
+
## 🐞 Troubleshooting
|
|
286
|
+
|
|
287
|
+
| Issue | Cause | Fix |
|
|
288
|
+
| --------------------- | ------------------------------------ | ----------------------------------------------------------------------- |
|
|
289
|
+
| "No entry file found" | Missing `src/index.*` | Create `src/index.ts` or equivalent |
|
|
290
|
+
| Express not reloading | File outside dependency graph | Import files directly from `express.(ts | js)` |
|
|
291
|
+
| Declarations missing | `--declaration=false` or JS template | Use TS template or enable flag |
|
|
292
|
+
| Publish fails | Not built | Run `makepack build` first |
|
|
293
|
+
| ESM import errors | Missing `"type": "module"` in root | Add `type` back in your source project (it’s stripped only in `.mpack`) |
|
|
294
|
+
|
|
295
|
+
---
|
|
296
|
+
|
|
297
|
+
## 🤝 Contributing
|
|
298
|
+
|
|
299
|
+
Contributions welcome! Suggested flow:
|
|
300
|
+
|
|
301
|
+
1. Fork & clone
|
|
302
|
+
2. Create a feature branch: `git checkout -b feat/your-idea`
|
|
303
|
+
3. Implement + add/update docs
|
|
304
|
+
4. Commit with conventional style: `feat(build): add xyz`
|
|
305
|
+
5. Open a PR
|
|
306
|
+
|
|
307
|
+
Please include clear reproduction steps for any bug fix.
|
|
308
|
+
|
|
309
|
+
### Future Ideas (Open for PRs)
|
|
310
|
+
- Plugin system for custom build steps
|
|
311
|
+
- Peer dependency auto‑detection
|
|
312
|
+
- Template customization presets
|
|
313
|
+
- E2E test harness
|
|
314
|
+
|
|
315
|
+
---
|
|
316
|
+
|
|
317
|
+
## 🔐 Security
|
|
318
|
+
|
|
319
|
+
No network calls are performed beyond npm install/publish and user code execution. Always audit generated dependencies before publishing.
|
|
320
|
+
|
|
321
|
+
Report vulnerabilities via GitHub Issues (consider labeling as `security`). Avoid posting exploit details publicly – request a private channel if needed.
|
|
322
|
+
|
|
323
|
+
---
|
|
324
|
+
|
|
325
|
+
## 📄 License
|
|
326
|
+
|
|
327
|
+
License: **TBD** (e.g. MIT). Add a `LICENSE` file such as:
|
|
328
|
+
|
|
329
|
+
```text
|
|
330
|
+
MIT License
|
|
331
|
+
Copyright (c) 2025 Devnax
|
|
332
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy...
|
|
333
|
+
```
|
|
334
|
+
|
|
335
|
+
---
|
|
336
|
+
|
|
337
|
+
## 🙋 FAQ
|
|
338
|
+
|
|
339
|
+
**Why strip `scripts` and `type` from the published package.json?**
|
|
340
|
+
To minimize accidental exposure of internal scripts and to keep the distributed package neutral; consumers rarely need them.
|
|
341
|
+
|
|
342
|
+
**Can I output only one format?**
|
|
343
|
+
Yes: `--format=esm` or `--format=cjs`.
|
|
344
|
+
|
|
345
|
+
**How do I include assets (e.g. CSS)?**
|
|
346
|
+
Import them from your entry; configure rollup/esbuild plugins in future versions (PRs welcome) – currently you’d manually copy in a post-step.
|
|
347
|
+
|
|
348
|
+
**Does it support monorepos?**
|
|
349
|
+
Not natively; you can still run it per package folder.
|
|
350
|
+
|
|
351
|
+
**Why another tool?**
|
|
352
|
+
To reduce the ceremony of picking + wiring rollup, tsconfig, scripts, vite dev preview, express hooks, and publish layout – all unified.
|
|
353
|
+
|
|
354
|
+
---
|
|
355
|
+
|
|
356
|
+
## 📬 Support
|
|
357
|
+
|
|
358
|
+
Open an issue for bugs, ideas, or questions: https://github.com/devnax/makepack/issues
|
|
359
|
+
|
|
360
|
+
---
|
|
361
|
+
|
|
362
|
+
<div align="center">
|
|
363
|
+
<sub>Built with ❤️ to streamline modern package creation.</sub>
|
|
364
|
+
</div>
|
|
365
|
+
|