인프런 커뮤니티 질문&답변

이찬원님의 프로필 이미지
이찬원

작성한 질문수

[리액트 1부] 만들고 비교하며 학습하는 리액트 (React)

import에 관해서 질문드립니다

작성

·

172

1

안녕하세요 강의 정말 잘 듣고 있습니다.

해당 강의를 듣는중 궁금한점이 생겨서 질문 드립니다.

제가 원래 java/spring을 공부하다가 이번에 프론트 엔드쪽에 관심이 생겨서 React를 학습중인데

ide에서는 .js 파일을 Import할때 뒤에 왜 자동으로 .js가 안붙도록 되어있나요?

저는 강사님과 다른 ide를 사용중인데도 여기서도 .js가 자동으로 붙지 않습니다.

import React from "react";
import Header from "./components/Header.js";
import KeywordList from "./components/KeywordList.js";
import SearchForm from "./components/SearchForm.js";
import SearchResult from "./components/SearchResult.js";
import Tabs, { TabType } from "./components/Tabs.js";
import store from "./Store.js";

제가 추측한건데 React를 import 하는 경우에는 react 파일이 typeScript로 되어있고 나머지 경우는 전부 javaScript로 되어있습니다. 따라서 기본이 .ts로 설정 되어 있어서 javascript파일은 별로로 명시해줘야 찾을 수 있게 되어 있다고 생각이 듭니다.

별로 의미없는 질문이지만 궁금해서 질문 드립니다.

감사합니다.

답변 1

1

김정환님의 프로필 이미지
김정환
지식공유자

'ide에서 파일을 가져올 때 왜 확장자가 붙지 않는가?' 라고 질문 주신 거죠?

저는 vscode를 사용하는데요. 강의를 만들 당시에는 확장자가 붙지 않는 것을 영상으로 확인했어요. 지금 vscode로 확인해 보니 또 잘 가져오더라고요. 참고로 1.85.1 버전을 사용합니다.

 

그런데 3-component 폴더에 있는 프로젝트는 가져오기할 때 확장자를 붙이지 않아도 됩니다. 웹팩이 모듈 가져오기를 모두 처리하는데요. 이때 js 확장자가 없어도 알아서 찾아주기 때문입니다.

1-vanilla, 2-react 폴더의 프로젝트는 웹팩을 사용하지 않아서 확장자를 붙여야했습니다. 브라우져의 모듈 시스템과 바벨 스탠드얼론 버전을 사용했는데요. 최소한의 개발 환경으로 리액트 수업에만 집중하려는 의도였습니다.

이찬원님의 프로필 이미지
이찬원
질문자

답변 감사합니다 ㅎㅎ

이찬원님의 프로필 이미지
이찬원

작성한 질문수

질문하기