source

'react'에서 반응하는 import *와 'react'에서 반응하는 import react의 차이점은 무엇입니까?

manycodes 2023. 4. 1. 09:39
반응형

'react'에서 반응하는 import *와 'react'에서 반응하는 import react의 차이점은 무엇입니까?

저는 리액트나 코딩 배경은 전반적으로 처음입니다.그리고 두 진술의 차이가 무엇인지 잘 모르겠습니다.

import * as react from 'react'

그리고.

import react from 'react'

잘 부탁드립니다!

가장 일반적으로 사용되는 수입품에는 세 가지 유형이 있습니다.

유형 1

import * as A from 'abc';

그러면 abc에서 export로 표시된 모든 것이 Import됩니다.아래 코드를 사용하여 액세스할 수 있습니다.

A.Component 

유형 2

import {A} from 'abc';

다음과 같은 것을 포함한 A를 abc에서 Import합니다.

export const A = () => {};

형식 3.

import A from 'abc';

그러면 기본 내보내기가 abc에서 A로 Import됩니다.내보내기는 다음과 같습니다.

const B = () => {}; // The name "B" is not exported, only the value.

export default B;  // at the end of component

양식import * as React from 'react는 React like Flow 또는 Typescript에서 유형 시스템을 사용하는 것과 관련이 있습니다.사용.import React from 'react'그럼 유형 정의 Import에 문제가 발생하였습니다.일단 Typescript에서 사용할 수 있습니다.allowSyntheticDefaultImportsflag: 이 문제를 해결하고 모든 유형을 가져옵니다.import React from 'react'.

일반적으로 ES2015(ES6) 모듈의 경우

import * as name from 'module';

는 내보내기된 모든 오브젝트가 네임스페이스에 배치됨을 나타내는 네임스페이스 Import입니다.다음 작업을 수행할 수 있습니다.

name.blabla1
name.blabla2
etc ...

네임스페이스를 호출할 수 없습니다.다음 작업을 수행할 수 없습니다.

name();

한편:

import name from 'module';

는 다음 항목에 해당하는 기본 Import입니다.

import {default as name} from 'module';

모듈에서 기본 개체만 가져옵니다.

React의 경우 React의 기본 내보내기가 다음과 같은 점에서 혼란이 발생할 수 있습니다.React(Babel은 상호 운용성을 위해 기본 내보내기를 추가합니다).엄밀히 말하면 사용하는 구문은 다음과 같습니다.

import * as React from 'react';

또는

import {Whatever} from 'react';

다음 작업은 Babel에 의한 변환만으로 이루어집니다(100% 확실하지는 않습니다).

import React from 'react';
import React, { Whatever } from 'react';

TypeScript를 사용하는 사용자의 경우 버전 2.7 이전의 기본값은 다음과 같습니다.

import * as name from 'module';

다음 항목에 해당합니다.

const name = require('module');

또, 다음과 같이 합니다.

import name from 'module';

다음 항목에 해당합니다.

const name = require('module').default;

버전 2.7 이후 컴파일러 설정에서 "esModule"이 지정되어 있는 경우interop"에서 true(권장)로 이동한 후 ES2015 구문 동작을 사용할 수 있습니다.

언급URL : https://stackoverflow.com/questions/54585763/what-is-the-difference-between-import-as-react-from-react-vs-import-react-fr

반응형