Skip to content

Commit b1c236a

Browse files
Add migration guide
1 parent 3e7dad3 commit b1c236a

File tree

2 files changed

+106
-0
lines changed

2 files changed

+106
-0
lines changed

packages/docs/astro.config.mjs

+1
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ export default defineConfig({
2323
{ label: "Using in Browser", link: "/guides/browser/" },
2424
{ label: "Writing Plugins", link: "/guides/writing-plugins/" },
2525
{ label: "Custom Jimp", link: "/guides/custom-jimp/" },
26+
{ label: "Migrate to v1", link: "/guides/migrate-to-v1/" },
2627
],
2728
},
2829
typeDocSidebarGroup,
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
---
2+
title: Migrating to v1
3+
description: How to migrate from v0 to v1
4+
---
5+
6+
The goals of v1 were to:
7+
8+
1. Make jimp easier to use in any environment
9+
2. Make jimp's API more consistent and easier to use
10+
11+
## Positional Arguments to Options Objects
12+
13+
In jimp v0 there were many ways to provide arguments to a method.
14+
Most methods used positional arguments, which leads to code thats harder to read and extend.
15+
16+
For example the resize method used to look like this:
17+
18+
```js
19+
image.resize(100, 100);
20+
```
21+
22+
Now it looks like this:
23+
24+
```js
25+
image.resize({ w: 100, h: 100 });
26+
```
27+
28+
### `ResizeStrategy.AUTO`
29+
30+
This constant was only needed for positional arguments.
31+
It is no longer needed with the new API.
32+
33+
## `Jimp` Constructor
34+
35+
The constructor for `Jimp` has changed.
36+
Much in the same vein as above, the constructor now takes an options object.
37+
38+
To create and empty jimp image:
39+
40+
```js
41+
import { Jimp } from "jimp";
42+
43+
const image = new Jimp({ width: 100, height: 100 });
44+
```
45+
46+
Even give it a background color:
47+
48+
```js
49+
const image = new Jimp({ width: 100, height: 100, color: 0xff0000ff });
50+
```
51+
52+
### `Jimp.read`
53+
54+
In v0 of jimp the constructor was async!
55+
This is a huge anit-pattern so it had to go.
56+
57+
Now you should instead use the `Jimp.read` method.
58+
59+
In node environments it will read a file from disk.
60+
61+
```js
62+
import { Jimp } from "jimp";
63+
64+
async function main() {
65+
const image = await Jimp.read("test/image.png");
66+
}
67+
```
68+
69+
In the browser it fetch the file from the url.
70+
71+
```js
72+
import { Jimp } from "jimp";
73+
74+
async function main() {
75+
const image = await Jimp.read("https://example.com/image.png");
76+
}
77+
```
78+
79+
### `Jimp.fromBuffer`
80+
81+
You can load an image from a buffer.
82+
In v0 this was done through the constructor.
83+
In v1 it is done through the `Jimp.fromBuffer` method.
84+
85+
```js
86+
import { Jimp } from "jimp";
87+
88+
async function main() {
89+
const image = await Jimp.fromBuffer(buffer);
90+
}
91+
```
92+
93+
### `Jimp.fromBitmap`
94+
95+
You can load an image from a bitmap.
96+
In v0 this was done through the constructor.
97+
In v1 it is done through the `Jimp.fromBitmap` method.
98+
99+
```js
100+
import { Jimp } from "jimp";
101+
102+
async function main() {
103+
const image = await Jimp.fromBitmap(bitmap);
104+
}
105+
```

0 commit comments

Comments
 (0)