리액트 - jsconfig.json로 component import 자동완성

리액트 전체 링크

 

아래와 같은 컴포넌트가 있다고 하자.

import React from 'react';

const AutoComplete = () => {
    return (
        <div>
            
        </div>
    );
};

export default AutoComplete;

 

App.js에서 auto를 입력하여도 자동완성이 나오지 않는다.

 

아래처럼 AutoComplete.js가 열려있다면, auto만 입력해도 자동으로 컴포넌트를 불러온다.

 

jsconfig.json을 만들어 설정을 추가하면 파일을 열지 않아도 자동으로 import 할 수 있다.

먼저 src > jsconfig.json 파일을 만든다.

 

Ctrl + Shift를 눌러서 나오는 내용을 입력하거나 아래의 코드를 추가한다.

 {
     "compilerOptions": {
         "target": "es6"
     }
 }

 

아래와 같이 파일을 열지 않아도 AutoComplete 컴포넌트가 잘 보이는 것을 알 수 있다.

혹시 잘 나타나지 않는다면, VS Code를 종료하고 다시 시작하면 된다.