Skip to content

Commit 7ef0b02

Browse files
committed
Migrate to import * as React from 'react'
Ref facebook/react#18102
1 parent 5a90553 commit 7ef0b02

File tree

35 files changed

+106
-104
lines changed

35 files changed

+106
-104
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ npx @svgr/cli --icon --replace-attr-values "#063855=currentColor" icon.svg
7878
**Output**
7979

8080
```js
81-
import React from 'react'
81+
import * as React from 'react'
8282

8383
const SvgComponent = props => (
8484
<svg width="1em" height="1em" viewBox="0 0 48 1" {...props}>

__fixtures__/template.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
module.exports = () => (code, state) => `
2-
import React from 'react'
2+
import * as React from 'react'
33
44
export default function ${state.componentName}() {
55
return ${code}

packages/babel-plugin-transform-svg-component/src/index.test.js

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ describe('plugin', () => {
1616
state: { componentName: 'SvgComponent' },
1717
})
1818
expect(code).toMatchInlineSnapshot(`
19-
"import React from \\"react\\";
19+
"import * as React from \\"react\\";
2020
2121
function SvgComponent() {
2222
return <svg><div /></svg>;
@@ -32,7 +32,7 @@ describe('plugin', () => {
3232
native: true,
3333
})
3434
expect(code).toMatchInlineSnapshot(`
35-
"import React from \\"react\\";
35+
"import * as React from \\"react\\";
3636
import Svg from \\"react-native-svg\\";
3737
3838
function SvgComponent() {
@@ -49,7 +49,7 @@ describe('plugin', () => {
4949
native: { expo: true },
5050
})
5151
expect(code).toMatchInlineSnapshot(`
52-
"import React from \\"react\\";
52+
"import * as React from \\"react\\";
5353
import \\"expo\\";
5454
5555
function SvgComponent() {
@@ -66,14 +66,14 @@ describe('plugin', () => {
6666
{ template },
6767
opts,
6868
{ jsx },
69-
) => template.ast`import React from 'react';
69+
) => template.ast`import * as React from 'react';
7070
const MyComponent = () => ${jsx}
7171
export default MyComponent
7272
`,
7373
state: { componentName: 'SvgComponent' },
7474
})
7575
expect(code).toMatchInlineSnapshot(`
76-
"import React from 'react';
76+
"import * as React from 'react';
7777
7878
const MyComponent = () => <svg><div /></svg>;
7979
@@ -116,7 +116,7 @@ describe('plugin', () => {
116116
ref: true,
117117
})
118118
expect(code).toMatchInlineSnapshot(`
119-
"import React from \\"react\\";
119+
"import * as React from \\"react\\";
120120
121121
function SvgComponent({
122122
svgRef
@@ -135,7 +135,7 @@ describe('plugin', () => {
135135
memo: true,
136136
})
137137
expect(code).toMatchInlineSnapshot(`
138-
"import React from \\"react\\";
138+
"import * as React from \\"react\\";
139139
140140
function SvgComponent() {
141141
return <svg><div /></svg>;
@@ -153,7 +153,7 @@ describe('plugin', () => {
153153
ref: true,
154154
})
155155
expect(code).toMatchInlineSnapshot(`
156-
"import React from \\"react\\";
156+
"import * as React from \\"react\\";
157157
158158
function SvgComponent({
159159
svgRef

packages/babel-plugin-transform-svg-component/src/util.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export const getProps = ({ types: t }, opts) => {
5050
export const getImport = ({ types: t }, opts) => {
5151
const importDeclarations = [
5252
t.importDeclaration(
53-
[t.importDefaultSpecifier(t.identifier('React'))],
53+
[t.importNamespaceSpecifier(t.identifier('React'))],
5454
t.stringLiteral('react'),
5555
),
5656
]

packages/babel-preset/src/index.test.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ describe('preset', () => {
2424
},
2525
}),
2626
).toMatchInlineSnapshot(`
27-
"import React from \\"react\\";
27+
"import * as React from \\"react\\";
2828
2929
function SvgComponent() {
3030
return <svg foo=\\"bar\\" x={y} />;
@@ -43,7 +43,7 @@ describe('preset', () => {
4343
},
4444
}),
4545
).toMatchInlineSnapshot(`
46-
"import React from \\"react\\";
46+
"import * as React from \\"react\\";
4747
import { Svg } from \\"expo\\";
4848
4949
function SvgComponent() {
@@ -63,7 +63,7 @@ describe('preset', () => {
6363
},
6464
}),
6565
).toMatchInlineSnapshot(`
66-
"import React from \\"react\\";
66+
"import * as React from \\"react\\";
6767
6868
function SvgComponent({
6969
title,
@@ -85,7 +85,7 @@ describe('preset', () => {
8585
},
8686
}),
8787
).toMatchInlineSnapshot(`
88-
"import React from \\"react\\";
88+
"import * as React from \\"react\\";
8989
9090
function SvgComponent({
9191
title,
@@ -105,7 +105,7 @@ describe('preset', () => {
105105
},
106106
}),
107107
).toMatchInlineSnapshot(`
108-
"import React from \\"react\\";
108+
"import * as React from \\"react\\";
109109
110110
function SvgComponent({
111111
title,
@@ -130,7 +130,7 @@ describe('preset', () => {
130130
},
131131
}),
132132
).toMatchInlineSnapshot(`
133-
"import React from \\"react\\";
133+
"import * as React from \\"react\\";
134134
135135
function SvgComponent() {
136136
return <svg a=\\"black\\" b={props.white} />;
@@ -151,7 +151,7 @@ describe('preset', () => {
151151
},
152152
}),
153153
).toMatchInlineSnapshot(`
154-
"import React from \\"react\\";
154+
"import * as React from \\"react\\";
155155
156156
function SvgComponent(props) {
157157
return <svg a=\\"#000\\" b=\\"#fff\\" width=\\"1em\\" height=\\"1em\\" {...props} />;

packages/cli/src/__snapshots__/index.test.js.snap

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ export { default as File } from './File'"
66
`;
77

88
exports[`cli should not override config with cli defaults 1`] = `
9-
"import React from \\"react\\";
9+
"import * as React from \\"react\\";
1010
1111
function SvgFile() {
1212
return <svg viewBox=\\"0 0 48 1\\"><title>{\\"Rectangle 5\\"}</title><desc>{\\"Created with Sketch.\\"}</desc><defs /><g id=\\"Page-1\\" stroke=\\"none\\" strokeWidth={1} fill=\\"none\\" fillRule=\\"evenodd\\"><g id=\\"19-Separator\\" transform=\\"translate(-129.000000, -156.000000)\\" fill=\\"#063855\\"><g id=\\"Controls/Settings\\" transform=\\"translate(80.000000, 0.000000)\\"><g id=\\"Content\\" transform=\\"translate(0.000000, 64.000000)\\"><g id=\\"Group\\" transform=\\"translate(24.000000, 56.000000)\\"><g id=\\"Group-2\\"><rect id=\\"Rectangle-5\\" x={25} y={36} width={48} height={1} /></g></g></g></g></g></g></svg>;
@@ -19,7 +19,7 @@ export default SvgFile;
1919
exports[`cli should support --index-template in cli 1`] = `"export { File } from './File'"`;
2020

2121
exports[`cli should support --prettier-config as file 1`] = `
22-
"import React from 'react'
22+
"import * as React from 'react'
2323
2424
function SvgFile(props) {
2525
return (
@@ -35,7 +35,7 @@ export default SvgFile
3535
`;
3636

3737
exports[`cli should support --prettier-config as json 1`] = `
38-
"import React from 'react'
38+
"import * as React from 'react'
3939
4040
function SvgFile(props) {
4141
return (
@@ -51,7 +51,7 @@ export default SvgFile
5151
`;
5252

5353
exports[`cli should support --svgo-config as file 1`] = `
54-
"import React from 'react'
54+
"import * as React from 'react'
5555
5656
function SvgFile(props) {
5757
return (
@@ -68,7 +68,7 @@ export default SvgFile
6868
`;
6969

7070
exports[`cli should support --svgo-config as json 1`] = `
71-
"import React from 'react'
71+
"import * as React from 'react'
7272
7373
function SvgFile(props) {
7474
return (
@@ -134,7 +134,7 @@ Array [
134134
`;
135135

136136
exports[`cli should support stdin filepath 1`] = `
137-
"import React from 'react'
137+
"import * as React from 'react'
138138
139139
function SvgFile(props) {
140140
return (
@@ -150,7 +150,7 @@ export default SvgFile
150150
`;
151151

152152
exports[`cli should support various args: --expand-props none 1`] = `
153-
"import React from 'react'
153+
"import * as React from 'react'
154154
155155
function SvgFile() {
156156
return (
@@ -166,7 +166,7 @@ export default SvgFile
166166
`;
167167

168168
exports[`cli should support various args: --expand-props start 1`] = `
169-
"import React from 'react'
169+
"import * as React from 'react'
170170
171171
function SvgFile(props) {
172172
return (
@@ -182,7 +182,7 @@ export default SvgFile
182182
`;
183183

184184
exports[`cli should support various args: --icon 1`] = `
185-
"import React from 'react'
185+
"import * as React from 'react'
186186
187187
function SvgFile(props) {
188188
return (
@@ -198,7 +198,7 @@ export default SvgFile
198198
`;
199199

200200
exports[`cli should support various args: --native --expand-props none 1`] = `
201-
"import React from 'react'
201+
"import * as React from 'react'
202202
import Svg, { Path } from 'react-native-svg'
203203
204204
function SvgFile() {
@@ -215,7 +215,7 @@ export default SvgFile
215215
`;
216216

217217
exports[`cli should support various args: --native --icon 1`] = `
218-
"import React from 'react'
218+
"import * as React from 'react'
219219
import Svg, { Path } from 'react-native-svg'
220220
221221
function SvgFile(props) {
@@ -232,7 +232,7 @@ export default SvgFile
232232
`;
233233

234234
exports[`cli should support various args: --native --ref 1`] = `
235-
"import React from 'react'
235+
"import * as React from 'react'
236236
import Svg, { Path } from 'react-native-svg'
237237
238238
function SvgFile({ svgRef, ...props }) {
@@ -252,7 +252,7 @@ export default ForwardRef
252252
`;
253253

254254
exports[`cli should support various args: --native 1`] = `
255-
"import React from 'react'
255+
"import * as React from 'react'
256256
import Svg, { Path } from 'react-native-svg'
257257
258258
function SvgFile(props) {
@@ -269,7 +269,7 @@ export default SvgFile
269269
`;
270270

271271
exports[`cli should support various args: --no-dimensions 1`] = `
272-
"import React from 'react'
272+
"import * as React from 'react'
273273
274274
function SvgFile(props) {
275275
return (
@@ -285,7 +285,7 @@ export default SvgFile
285285
`;
286286

287287
exports[`cli should support various args: --no-prettier 1`] = `
288-
"import React from \\"react\\";
288+
"import * as React from \\"react\\";
289289
290290
function SvgFile(props) {
291291
return <svg width={48} height={1} {...props}><path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" /></svg>;
@@ -296,7 +296,7 @@ export default SvgFile;
296296
`;
297297

298298
exports[`cli should support various args: --no-svgo 1`] = `
299-
"import React from 'react'
299+
"import * as React from 'react'
300300
301301
function SvgFile(props) {
302302
return (
@@ -337,7 +337,7 @@ export default SvgFile
337337
`;
338338

339339
exports[`cli should support various args: --ref 1`] = `
340-
"import React from 'react'
340+
"import * as React from 'react'
341341
342342
function SvgFile({ svgRef, ...props }) {
343343
return (
@@ -356,7 +356,7 @@ export default ForwardRef
356356
`;
357357

358358
exports[`cli should support various args: --replace-attr-values "#063855=currentColor" 1`] = `
359-
"import React from 'react'
359+
"import * as React from 'react'
360360
361361
function SvgFile(props) {
362362
return (
@@ -372,7 +372,7 @@ export default SvgFile
372372
`;
373373

374374
exports[`cli should support various args: --svg-props "hidden={true},id=hello" 1`] = `
375-
"import React from 'react'
375+
"import * as React from 'react'
376376
377377
function SvgFile(props) {
378378
return (
@@ -388,7 +388,7 @@ export default SvgFile
388388
`;
389389

390390
exports[`cli should support various args: --title-prop 1`] = `
391-
"import React from 'react'
391+
"import * as React from 'react'
392392
393393
function SvgFile({ title, titleId, ...props }) {
394394
return (
@@ -426,7 +426,7 @@ __fixtures__/withSvgrRc/file.svg -> __fixtures_build__/whole/withSvgrRc/File.js"
426426
`;
427427

428428
exports[`cli should work with a simple file 1`] = `
429-
"import React from 'react'
429+
"import * as React from 'react'
430430
431431
function SvgFile(props) {
432432
return (
@@ -442,7 +442,7 @@ export default SvgFile
442442
`;
443443

444444
exports[`cli should work with stdin 1`] = `
445-
"import React from 'react'
445+
"import * as React from 'react'
446446
447447
function SvgComponent(props) {
448448
return (

packages/cli/src/__snapshots__/util.test.js.snap

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`util #convertFile should convert a file 1`] = `
4-
"import React from 'react'
4+
"import * as React from 'react'
55
66
function SvgFile(props) {
77
return (
@@ -16,7 +16,7 @@ export default SvgFile
1616
`;
1717

1818
exports[`util #convertFile should support a custom config path 1`] = `
19-
"import React from 'react'
19+
"import * as React from 'react'
2020
2121
function SvgFile(props) {
2222
return (

0 commit comments

Comments
 (0)