Skip to content

Commit c1fd826

Browse files
authored
Merge pull request #271 from lunaruan/update_react_imports
update-react-imports: Destructure named exports
2 parents 84adc1e + 37e734f commit c1fd826

17 files changed

+329
-37
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -145,7 +145,7 @@ npx react-codemod sort-comp <path>
145145

146146
#### `update-react-imports`
147147

148-
[As of Babel 7.9.0](https://babeljs.io/blog/2020/03/16/7.9.0#a-new-jsx-transform-11154-https-githubcom-babel-babel-pull-11154), when using `runtime: automatic` in `@babel/preset-react` or `@babel/plugin-transform-react-jsx`, you will not need to explicitly import React for compiling jsx. This codemod removes the redundant import statements. It also converts (`import React from 'react'`) to named imports (`import * as React from 'react`).
148+
[As of Babel 7.9.0](https://babeljs.io/blog/2020/03/16/7.9.0#a-new-jsx-transform-11154-https-githubcom-babel-babel-pull-11154), when using `runtime: automatic` in `@babel/preset-react` or `@babel/plugin-transform-react-jsx`, you will not need to explicitly import React for compiling jsx. This codemod removes the redundant import statements. It also converts (`import React from 'react'`) to named imports (`import * as React from 'react'`).
149149

150150
```sh
151151
npx react-codemod update-react-imports <path>

bin/cli.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -183,7 +183,7 @@ const TRANSFORMER_INQUIRER_CHOICES = [
183183
value: 'sort-comp'
184184
},
185185
{
186-
name: 'update-react-imports: Removes redundant import statements from explicitly importing React to compile JSX and converts default imports to named imports',
186+
name: 'update-react-imports: Removes redundant import statements from explicitly importing React to compile JSX and converts default imports to destructured named imports',
187187
value: 'update-react-imports',
188188
}
189189
];
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { Element, Component } from "react";
2-
import * as React from "react";
2+
import { createElement } from "react";
33

4-
React.createElement('div', {});
4+
createElement('div', {});
55

66
<div>Hi</div>;
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import * as React from 'react';
2+
3+
React.useState(false);

transforms/__testfixtures__/update-react-imports/react-already-used-named-export.output.js

Whitespace-only changes.
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import * as React from "react";
1+
import { createElement } from "react";
22

3-
React.createElement('div', {});
3+
createElement('div', {});
44

55
<div></div>;
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
1-
import * as React from "react";
1+
import { createElement } from "react";
22

3-
React.createElement('div', 'la');
3+
createElement('div', 'la');
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import React, { useState } from 'react';
2+
3+
<React.Fragment />
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { Fragment, useState } from "react";
2+
3+
<Fragment />
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import React from "react";
2+
3+
React.createElement('div', {});
4+
5+
Promise.resolve(React);
6+
7+
<div>Hi</div>

0 commit comments

Comments
 (0)