ipx 3.1.1 → 4.0.0-alpha.2

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 (31) hide show
  1. package/README.md +69 -42
  2. package/dist/THIRD-PARTY-LICENSES.md +539 -0
  3. package/dist/_chunks/libs/@fastify/accept-negotiator.mjs +71 -0
  4. package/dist/_chunks/libs/boolbase.mjs +12 -0
  5. package/dist/_chunks/libs/css-select.mjs +4139 -0
  6. package/dist/_chunks/libs/css-tree.mjs +31158 -0
  7. package/dist/_chunks/libs/csso.mjs +1834 -0
  8. package/dist/_chunks/libs/etag.mjs +25 -0
  9. package/dist/_chunks/libs/h3.mjs +267 -0
  10. package/dist/_chunks/libs/image-meta.d.mts +12 -0
  11. package/dist/_chunks/libs/image-meta.mjs +558 -0
  12. package/dist/_chunks/libs/sax.mjs +836 -0
  13. package/dist/_chunks/libs/svgo.mjs +5918 -0
  14. package/dist/_chunks/libs/ufo.mjs +41 -0
  15. package/dist/_chunks/node-fs.mjs +690 -0
  16. package/dist/_chunks/rolldown-runtime.mjs +42 -0
  17. package/dist/_chunks/svgo-node.mjs +3 -0
  18. package/dist/cli.d.mts +1 -2
  19. package/dist/cli.mjs +67 -59
  20. package/dist/index.d.mts +214 -321
  21. package/dist/index.mjs +30 -50
  22. package/package.json +44 -49
  23. package/bin/ipx.mjs +0 -2
  24. package/dist/cli.cjs +0 -63
  25. package/dist/cli.d.cts +0 -2
  26. package/dist/cli.d.ts +0 -2
  27. package/dist/index.cjs +0 -62
  28. package/dist/index.d.cts +0 -397
  29. package/dist/index.d.ts +0 -397
  30. package/dist/shared/ipx.CXJeaylD.mjs +0 -764
  31. package/dist/shared/ipx.GUc23orS.cjs +0 -778
package/README.md CHANGED
@@ -1,15 +1,24 @@
1
1
  # 🖼️ IPX
2
2
 
3
- [![npm version][npm-version-src]][npm-version-href]
4
- [![npm downloads][npm-downloads-src]][npm-downloads-href]
3
+ <!-- automd:badges color=yellow -->
5
4
 
6
- > [!NOTE]
7
- > This is the active development branch. Check out [v2](https://github.com/unjs/ipx/tree/v2) and [v3](https://github.com/unjs/ipx/tree/v3) for older docs.
5
+ [![npm version](https://img.shields.io/npm/v/ipx?color=yellow)](https://npmjs.com/package/ipx)
6
+ [![npm downloads](https://img.shields.io/npm/dm/ipx?color=yellow)](https://npm.chart.dev/ipx)
7
+
8
+ <!-- /automd -->
8
9
 
9
10
  High performance, secure and easy-to-use image optimizer powered by [sharp](https://github.com/lovell/sharp) and [svgo](https://github.com/svg/svgo).
10
11
 
11
12
  Used by [Nuxt Image](https://image.nuxt.com/) and [Netlify](https://www.npmjs.com/package/@netlify/ipx) and open to everyone!
12
13
 
14
+ ## Migration from v3 to v4
15
+
16
+ > [!NOTE]
17
+ > This is the active development branch for IPX v4. Check out [v3](https://github.com/unjs/ipx/tree/v3) for v3 docs.
18
+
19
+ - The server creation APIs have changed. See the Programmatic API section for examples.
20
+ - The JSON error format has changed from `{ error: string }` to `{ status, statusText, message }`.
21
+
13
22
  ## Using CLI
14
23
 
15
24
  You can use `ipx` command to start server.
@@ -23,7 +32,7 @@ npx ipx serve --dir ./
23
32
  Using `bun`
24
33
 
25
34
  ```bash
26
- bun x npx ipx serve --dir ./
35
+ bunx ipx serve --dir ./
27
36
  ```
28
37
 
29
38
  The default serve directory is the current working directory.
@@ -32,59 +41,89 @@ The default serve directory is the current working directory.
32
41
 
33
42
  You can use IPX as a middleware or directly use IPX interface.
34
43
 
35
- ```ts
36
- import { createIPX, ipxFSStorage, ipxHttpStorage } from "ipx";
44
+ **Example:** Using built-in server
45
+
46
+ <!-- automd:file code src="./examples/serve.ts" -->
47
+
48
+ ```ts [serve.ts]
49
+ import { serveIPX, createIPX, ipxFSStorage, ipxHttpStorage } from "ipx";
37
50
 
38
51
  const ipx = createIPX({
39
52
  storage: ipxFSStorage({ dir: "./public" }),
40
53
  httpStorage: ipxHttpStorage({ domains: ["picsum.photos"] }),
54
+ alias: { "/picsum": "https://picsum.photos" },
41
55
  });
56
+
57
+ // http://localhost:3000/w_512/picsum/1000
58
+ serveIPX(ipx);
42
59
  ```
43
60
 
44
- **Example**: Using with [unjs/h3](https://github.com/unjs/h3):
61
+ <!-- /automd -->
62
+
63
+ **Example**: Using with [h3](https://h3.dev)
64
+
65
+ <!-- automd:file code src="./examples/h3.ts" -->
66
+
67
+ ```ts [h3.ts]
68
+ import { H3, serve } from "h3";
45
69
 
46
- ```js
47
- import { listen } from "listhen";
48
- import { createApp, toNodeListener } from "h3";
49
70
  import {
50
71
  createIPX,
51
72
  ipxFSStorage,
52
73
  ipxHttpStorage,
53
- createIPXH3Handler,
74
+ createIPXFetchHandler,
54
75
  } from "ipx";
55
76
 
56
77
  const ipx = createIPX({
57
78
  storage: ipxFSStorage({ dir: "./public" }),
58
79
  httpStorage: ipxHttpStorage({ domains: ["picsum.photos"] }),
80
+ alias: { "/picsum": "https://picsum.photos" },
59
81
  });
60
82
 
61
- const app = createApp().use("/", createIPXH3Handler(ipx));
83
+ const app = new H3();
84
+
85
+ app.mount("/ipx", createIPXFetchHandler(ipx));
62
86
 
63
- listen(toNodeListener(app));
87
+ // http://localhost:3000/ipx/w_512/picsum/1000
88
+ serve(app);
64
89
  ```
65
90
 
66
- **Example:** Using [express](https://expressjs.com):
91
+ <!-- /automd -->
92
+
93
+ **Example:** Using with [express](https://expressjs.com)
94
+
95
+ <!-- automd:file code src="./examples/express.ts" -->
96
+
97
+ ```ts [express.ts]
98
+ import Express from "express";
67
99
 
68
- ```js
69
- import { listen } from "listhen";
70
- import express from "express";
71
100
  import {
72
101
  createIPX,
73
102
  ipxFSStorage,
74
103
  ipxHttpStorage,
75
- createIPXNodeServer,
104
+ createIPXNodeHandler,
76
105
  } from "ipx";
77
106
 
107
+ import type { RequestHandler } from "express";
108
+
78
109
  const ipx = createIPX({
79
110
  storage: ipxFSStorage({ dir: "./public" }),
80
111
  httpStorage: ipxHttpStorage({ domains: ["picsum.photos"] }),
112
+ alias: { "/picsum": "https://picsum.photos" },
81
113
  });
82
114
 
83
- const app = express().use("/", createIPXNodeServer(ipx));
115
+ const app = Express();
84
116
 
85
- listen(app);
117
+ app.use("/ipx", createIPXNodeHandler(ipx) as RequestHandler);
118
+
119
+ // http://localhost:3000/ipx/w_512/picsum/1000
120
+ app.listen(3000, () => {
121
+ console.log("Server is running on http://localhost:3000");
122
+ });
86
123
  ```
87
124
 
125
+ <!-- /automd -->
126
+
88
127
  ## URL Examples
89
128
 
90
129
  Get original image:
@@ -112,7 +151,6 @@ Resize to `200x200px` using `embed` method and change format to `webp`:
112
151
  You can universally customize IPX configuration using `IPX_*` environment variables.
113
152
 
114
153
  - `IPX_ALIAS`
115
-
116
154
  - Default: `{}`
117
155
 
118
156
  ### Filesystem Source Options
@@ -151,8 +189,8 @@ You can universally customize IPX configuration using `IPX_*` environment variab
151
189
 
152
190
  | Property | Docs | Example | Comments |
153
191
  | -------------- | :-------------------------------------------------------------- | :--------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
154
- | width / w | [Docs](https://sharp.pixelplumbing.com/api-resize#resize) | `/width_200/buffalo.png` |
155
- | height / h | [Docs](https://sharp.pixelplumbing.com/api-resize#resize) | `/height_200/buffalo.png` |
192
+ | width / w | [Docs](https://sharp.pixelplumbing.com/api-resize#resize) | `/width_200/buffalo.png` or `/w_200/buffalo.png` |
193
+ | height / h | [Docs](https://sharp.pixelplumbing.com/api-resize#resize) | `/height_200/buffalo.png` or `/h_200/buffalo.png` |
156
194
  | resize / s | [Docs](https://sharp.pixelplumbing.com/api-resize#resize) | `/s_200x200/buffalo.png` |
157
195
  | kernel | [Docs](https://sharp.pixelplumbing.com/api-resize#resize) | `/s_200x200,kernel_nearest/buffalo.png` | Supported kernel: `nearest`, `cubic`, `mitchell`, `lanczos2` and `lanczos3` (default). |
158
196
  | fit | [Docs](https://sharp.pixelplumbing.com/api-resize#resize) | `/s_200x200,fit_outside/buffalo.png` | Sets `fit` option for `resize`. |
@@ -161,8 +199,9 @@ You can universally customize IPX configuration using `IPX_*` environment variab
161
199
  | extend | [Docs](https://sharp.pixelplumbing.com/api-resize#extend) | `/extend_{top}_{right}_{bottom}_{left}/buffalo.png` | Extend / pad / extrude one or more edges of the image with either the provided background colour or pixels derived from the image. |
162
200
  | background / b | \_ | `/r_45,b_00ff00/buffalo.png` |
163
201
  | extract | [Docs](https://sharp.pixelplumbing.com/api-resize#extract) | `/extract_{left}_{top}_{width}_{height}/buffalo.png` | Extract/crop a region of the image. |
164
- | format / f | [Docs](https://sharp.pixelplumbing.com/api-output#toformat) | `/format_webp/buffalo.png` | Supported format: `jpg`, `jpeg`, `png`, `webp`, `avif`, `gif`, `heif`, `tiff` and `auto` (experimental only with middleware) |
165
- | quality / q | \_ | `/quality_50/buffalo.png` | Accepted values: 0 to 100 |
202
+ | crop | [Docs](https://sharp.pixelplumbing.com/api-resize#extract) | `/crop_{left}_{top}_{width}_{height}/buffalo.png` | Alias for extract. Extract/crop a region of the image. |
203
+ | format / f | [Docs](https://sharp.pixelplumbing.com/api-output#toformat) | `/format_webp/buffalo.png` or `/f_webp/buffalo.png` | Supported format: `jpg`, `jpeg`, `png`, `webp`, `avif`, `gif`, `heif`, `tiff` and `auto` (experimental only with middleware) |
204
+ | quality / q | \_ | `/quality_50/buffalo.png` or `/q_50/buffalo.png` | Accepted values: 0 to 100 |
166
205
  | rotate | [Docs](https://sharp.pixelplumbing.com/api-operation#rotate) | `/rotate_45/buffalo.png` |
167
206
  | enlarge | \_ | `/enlarge,s_2000x2000/buffalo.png` | Allow the image to be upscaled. By default the returned image will never be larger than the source in any dimension, while preserving the requested aspect ratio. |
168
207
  | flip | [Docs](https://sharp.pixelplumbing.com/api-operation#flip) | `/flip/buffalo.png` |
@@ -176,23 +215,11 @@ You can universally customize IPX configuration using `IPX_*` environment variab
176
215
  | threshold | [Docs](https://sharp.pixelplumbing.com/api-operation#threshold) | `/threshold_10/buffalo.png` |
177
216
  | tint | [Docs](https://sharp.pixelplumbing.com/api-colour#tint) | `/tint_1098123/buffalo.png` |
178
217
  | grayscale | [Docs](https://sharp.pixelplumbing.com/api-colour#grayscale) | `/grayscale/buffalo.png` |
179
- | animated | - | `/animated/buffalo.gif` | Experimental |
218
+ | flatten | [Docs](https://sharp.pixelplumbing.com/api-operation#flatten) | `/flatten/buffalo.png` | Remove alpha channel, if any, and replace with background colour. |
219
+ | modulate | [Docs](https://sharp.pixelplumbing.com/api-operation#modulate) | `/modulate_brightness_saturation_hue/buffalo.png` | Transforms the image using brightness, saturation and hue rotation. |
220
+ | crop | [Docs](https://sharp.pixelplumbing.com/api-resize#extract) | `/crop_{left}_{top}_{width}_{height}/buffalo.png` | Alias for extract. Extract/crop a region of the image. |
221
+ | animated / a | - | `/animated/buffalo.gif` or `/a/buffalo.gif` | Experimental |
180
222
 
181
223
  ## License
182
224
 
183
225
  [MIT](./LICENSE)
184
-
185
- <!-- Badges -->
186
-
187
- [npm-version-src]: https://img.shields.io/npm/v/ipx?style=flat&colorA=18181B&colorB=F0DB4F
188
- [npm-version-href]: https://npmjs.com/package/ipx
189
- [npm-downloads-src]: https://img.shields.io/npm/dm/ipx?style=flat&colorA=18181B&colorB=F0DB4F
190
- [npm-downloads-href]: https://npmjs.com/package/ipx
191
- [github-actions-src]: https://img.shields.io/github/workflow/status/unjs/ipx/ci/main?style=flat&colorA=18181B&colorB=F0DB4F
192
- [github-actions-href]: https://github.com/unjs/ipx/actions?query=workflow%3Aci
193
- [codecov-src]: https://img.shields.io/codecov/c/gh/unjs/ipx/main?style=flat&colorA=18181B&colorB=F0DB4F
194
- [codecov-href]: https://codecov.io/gh/unjs/ipx
195
- [bundle-src]: https://img.shields.io/bundlephobia/minzip/ipx?style=flat&colorA=18181B&colorB=F0DB4F
196
- [bundle-href]: https://bundlephobia.com/result?p=ipx
197
- [license-src]: https://img.shields.io/github/license/unjs/ipx.svg?style=flat&colorA=18181B&colorB=F0DB4F
198
- [license-href]: https://github.com/unjs/ipx/blob/main/LICENSE