Skip to content

Commit 5a3b0a1

Browse files
AugustinMauroyAugustinMauroy
authored
Content(migrations): update (nodejs#8881)
* content(migrations): add more codemod * fix: use diff * content: migrations/axios-to-fetch * lint:fix * Update v14-to-v16.mdx * Update axios-to-fetch.mdx
1 parent 5525885 commit 5a3b0a1

8 files changed

Lines changed: 436 additions & 197 deletions

File tree

‎apps/site/authors.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -227,7 +227,7 @@
227227
"name": "Richard Lau",
228228
"website": "https://github.com/richardlau"
229229
},
230-
"Richie McColl": {
230+
"richiemccoll": {
231231
"id": "richiemccoll",
232232
"name": "Richie McColl",
233233
"website": "https://github.com/richiemccoll"

‎apps/site/pages/en/blog/migrations/axios-to-fetch.mdx‎

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
---
2+
date: '2026-05-09T00:00:00.000Z'
3+
category: migrations
4+
title: Axios to WHATWG Fetch
5+
layout: blog-post
6+
author: AugustinMauroy
7+
---
8+
9+
# Migrate from Axios to WHATWG Fetch
10+
11+
This codemod transforms code using [Axios](https://github.com/axios/axios) to leverage the [WHATWG Fetch API](https://fetch.spec.whatwg.org/), which is now natively available in Node.js.
12+
13+
## Why doing this?
14+
15+
- **Native Support**: Fetch is built into Node.js, eliminating the need for external libraries and their associated maintenance overhead.
16+
- **Improved Performance**: Fetch is optimized for modern JavaScript runtimes, often resulting in better performance compared to Axios.
17+
- **Better Standards Compliance**: Fetch adheres closely to web standards, making it easier to write cross-platform code that works both in Node.js and browsers.
18+
- **Reduced Security Risks**: Removing Axios eliminates potential vulnerabilities associated with third-party dependencies, enhancing the security of your application.
19+
20+
## Node.js Version Requirements
21+
22+
- Node.js v18.0.0 or later (Fetch API is available but marked experimental)
23+
- Node.js v21.0.0 or later (Fetch API is stable)
24+
25+
> If your package currently supports Node.js versions earlier than v18.0.0, you cannot migrate to the Fetch API without dropping support for those versions.
26+
> This requires bumping the major version of your package AND updating the engines field in your package.json to require Node.js >= v18.0.0.
27+
28+
## Supported Transformations
29+
30+
The codemod supports the following Axios methods and converts them to their Fetch equivalents:
31+
32+
- `axios.request(config)`
33+
- `axios.get(url[, config])`
34+
- `axios.delete(url[, config])`
35+
- `axios.head(url[, config])`
36+
- `axios.options(url[, config])`
37+
- `axios.post(url[, data[, config]])`
38+
- `axios.put(url[, data[, config]])`
39+
- `axios.patch(url[, data[, config]])`
40+
- `axios.postForm(url[, data[, config]])`
41+
- `axios.putForm(url[, data[, config]])`
42+
- `axios.patchForm(url[, data[, config]])`
43+
44+
## Examples
45+
46+
### GET Request
47+
48+
```diff
49+
const base = 'https://dummyjson.com/todos';
50+
51+
- const all = await axios.get(base);
52+
+ const all = await fetch(base).then(async (res) => Object.assign(res, { data: await res.json() })).catch(() => null);
53+
console.log('\nGET /todos ->', all.status);
54+
console.log(`Preview: ${all.data.todos.length} todos`);
55+
```
56+
57+
### POST Request
58+
59+
```diff
60+
const base = 'https://dummyjson.com/todos';
61+
62+
- const created = await axios.post(
63+
- `${base}/add`, {
64+
- todo: 'Use DummyJSON in the project',
65+
- completed: false,
66+
- userId: 5,
67+
- }, {
68+
- headers: { 'Content-Type': 'application/json' }
69+
- }
70+
- );
71+
+ const created = await fetch(`${base}/add`, {
72+
+ method: 'POST',
73+
+ headers: { 'Content-Type': 'application/json' },
74+
+ body: JSON.stringify({
75+
+ todo: 'Use DummyJSON in the project',
76+
+ completed: false,
77+
+ userId: 5,
78+
+ }),
79+
+ }).then(async (res) => Object.assign(res, { data: await res.json() }));
80+
console.log('\nPOST /todos/add ->', created.status);
81+
console.log('Preview:', created.data?.id ? `created id ${created.data.id}` : JSON.stringify(created.data).slice(0,200));
82+
```
83+
84+
### POST Form Request
85+
86+
```diff
87+
const formEndpoint = '/submit';
88+
89+
- const created = await axios.postForm(formEndpoint, {
90+
- title: 'Form Demo',
91+
- completed: false,
92+
- });
93+
+ const created = await fetch(formEndpoint, {
94+
+ method: 'POST',
95+
+ body: new URLSearchParams({
96+
+ title: 'Form Demo',
97+
+ completed: false,
98+
+ }),
99+
+ }).then(async (res) => Object.assign(res, { data: await res.json() }));
100+
console.log('Preview:', created.data);
101+
```
102+
103+
### PUT Request
104+
105+
```diff
106+
const base = 'https://dummyjson.com/todos';
107+
108+
- const updatedPut = await axios.put(
109+
- `${base}/1`,
110+
- { completed: false },
111+
- { headers: { 'Content-Type': 'application/json' } }
112+
- );
113+
+ const updatedPut = await fetch(`${base}/1`, {
114+
+ method: 'PUT',
115+
+ headers: { 'Content-Type': 'application/json' },
116+
+ body: JSON.stringify({ completed: false }),
117+
+ }).then(async (res) => Object.assign(res, { data: await res.json() }));
118+
console.log('\nPUT /todos/1 ->', updatedPut.status);
119+
console.log('Preview:', updatedPut.data?.completed !== undefined ? `completed=${updatedPut.data.completed}` : JSON.stringify(updatedPut.data).slice(0,200));
120+
```
121+
122+
### DELETE Request
123+
124+
```diff
125+
const base = 'https://dummyjson.com/todos';
126+
127+
- const deleted = await axios.delete(`${base}/1`);
128+
+ const deleted = await fetch(`${base}/1`, { method: 'DELETE' })
129+
+ .then(async (res) => Object.assign(res, { data: await res.json() }));
130+
console.log('\nDELETE /todos/1 ->', deleted.status);
131+
console.log('Preview:', deleted.data ? JSON.stringify(deleted.data).slice(0,200) : typeof deleted.data);
132+
```
133+
134+
### `request` Axios Method
135+
136+
```diff
137+
const base = 'https://dummyjson.com/todos';
138+
139+
- const customRequest = await axios.request({
140+
- url: `${base}/1`,
141+
- method: 'PATCH',
142+
- headers: { 'Content-Type': 'application/json' },
143+
- data: { completed: true },
144+
- });
145+
+ const customRequest = await fetch(`${base}/1`, {
146+
+ method: 'PATCH',
147+
+ headers: { 'Content-Type': 'application/json' },
148+
+ body: JSON.stringify({ completed: true }),
149+
+ }).then(async (res) => Object.assign(res, { data: await res.json() }));
150+
console.log('\nPATCH /todos/1 ->', customRequest.status);
151+
console.log('Preview:', customRequest.data?.completed !== undefined ? `completed=${customRequest.data.completed}` : JSON.stringify(customRequest.data).slice(0,200));
152+
```
153+
154+
## Unsupported APIs
155+
156+
The codemod does not yet cover Axios features outside of direct request helpers, such as interceptors, cancel tokens, or instance configuration from `axios.create()`.
157+
158+
## Recognition
159+
160+
We would like to thank the maintainers of [Axios](https://github.com/axios/axios) for their support of the package over time and for its contributions to the ecosystem.

‎apps/site/pages/en/blog/migrations/chalk-to-styletext.mdx‎

Lines changed: 16 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,9 @@ author: richiemccoll
88

99
# Migrate from Chalk to Node.js util styleText
1010

11-
## `chalk-to-util-styletext`
12-
1311
This codemod aims to help you reduce external dependencies by transforming chalk method calls to use the native Node.js styling functionality. It will also handle automatic removal of the [`chalk`](https://github.com/chalk/chalk) package from the package.json.
1412

15-
### Compatible Features:
13+
## Compatible Features:
1614

1715
- Basic colors (red, green, blue, yellow, etc.)
1816
- Bright colors (redBright, greenBright, etc.)
@@ -21,24 +19,22 @@ This codemod aims to help you reduce external dependencies by transforming chalk
2119
- Style chaining via array syntax
2220
- Environment variable support (NO_COLOR, NODE_DISABLE_COLORS, FORCE_COLOR)
2321

24-
### Incompatible Features:
22+
## Incompatible Features:
2523

2624
- Custom RGB colors (chalk.rgb(), chalk.hex())
2725
- 256-color palette (chalk.ansi256())
2826
- Template literal syntax (chalk...``)
2927
- Advanced modifiers with limited terminal support (overline, blink, etc.)
3028

31-
### Prerequisites:
32-
33-
#### Node.js Version Requirements
29+
## Node.js Version Requirements
3430

3531
- Node.js v20.12.0 or later (for util.styleText)
3632
- `util.styleText` became stable in Node.js v22.13.0 (and v23.5.0)
3733

3834
> If your package currently supports Node.js versions earlier than v20.12.0, you cannot migrate to util.styleText without dropping support for those versions.
3935
> This requires bumping the major version of your package AND updating the engines field in your package.json to require Node.js >= v20.12.0.
4036
41-
### Usage:
37+
## Usage:
4238

4339
The source code for this codemod can be found in the [chalk-to-util-styletext directory](https://github.com/nodejs/userland-migrations/tree/main/recipes/chalk-to-util-styletext).
4440

@@ -48,33 +44,23 @@ You can find this codemod in the [Codemod Registry](https://app.codemod.com/regi
4844
npx codemod @nodejs/chalk-to-util-styletext
4945
```
5046

51-
### Example:
47+
## Example:
5248

53-
```js displayName="Before"
54-
import chalk from 'chalk';
49+
```diff
50+
- import chalk from 'chalk';
51+
+ import { styleText } from 'node:util';
5552

56-
console.log(chalk.red('Error message'));
53+
- console.log(chalk.red('Error message'));
54+
+ console.log(styleText('red', 'Error message'));
5755

58-
console.log(chalk.red.bold('Important error'));
56+
- console.log(chalk.green.underline('Success with emphasis'));
57+
+ console.log(styleText(['green', 'underline'], 'Success with emphasis'));
5958

60-
const red = chalk.red;
59+
- const red = chalk.red;
60+
+ const red = (text) => styleText('red', text);
61+
- const boldBlue = chalk.blue.bold;
62+
+ const boldBlue = (text) => styleText(['blue', 'bold'], text);
6163
console.log(red('Error'));
62-
63-
const boldBlue = chalk.blue.bold;
64-
console.log(boldBlue('Info'));
65-
```
66-
67-
```js displayName="After"
68-
import { styleText } from 'node:util';
69-
70-
console.log(styleText('red', 'Error message'));
71-
72-
console.log(styleText(['red', 'bold'], 'Important error'));
73-
74-
const red = text => styleText('red', text);
75-
console.log(red('Error'));
76-
77-
const boldBlue = text => styleText(['blue', 'bold'], text);
7864
console.log(boldBlue('Info'));
7965
```
8066

‎apps/site/pages/en/blog/migrations/v12-to-v14.mdx‎

Lines changed: 12 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -30,23 +30,20 @@ The source code for this codemod can be found in the [util-print-to-console-log
3030
You can find this codemod in the [Codemod Registry](https://app.codemod.com/registry/@nodejs/util-print-to-console-log).
3131

3232
```bash
33-
npx codemod run @nodejs/create-require-from-path
33+
npx codemod run @nodejs/util-print-to-console-log
3434
```
3535

3636
### Example:
3737

38-
```js displayName="Before"
39-
const util = require('node:util');
40-
41-
util.print('Hello world');
42-
util.puts('Hello world');
43-
util.debug('Hello world');
44-
util.error('Hello world');
45-
```
46-
47-
```js displayName="After"
48-
console.log('Hello world');
49-
console.log('Hello world');
50-
console.error('Hello world');
51-
console.error('Hello world');
38+
```diff
39+
- const util = require("node:util");
40+
41+
- util.print("Hello world");
42+
+ console.log("Hello world");
43+
- util.puts("Hello world");
44+
+ console.log("Hello world");
45+
- util.debug("Hello world");
46+
+ console.error("Hello world");
47+
- util.error("Hello world");
48+
+ console.error("Hello world");
5249
```

0 commit comments

Comments
 (0)