모듈 시스템 질문
4.2) 첫 React App 생성하기 강의 질문 입니다.
10:15에서 module.exports = { … } 로 시작하는데 이건 cjs 시스템 문법으로 알고 있는데, 5:14에서 나오는 package.json의 type은 module로 되어있는데 두개의 시스템을 동시에 사용하는게 가능한건가요?
답변 2
1
안녕하세요 이정환입니다.
말씀하신 10분 15초 경의 파일은 .eslintrc.cjs 파일입니다. 이처럼 cjs 확장자를 명시적으로 설정해 둔 경우에는 강제로 Common JS로 해석되어 혼용이 가능합니다.
참고로 이 파일에만 특별히 cjs 확장자가 설정된 이유는 ESLint 도구의 설정 자체가 기본적으로 CommonJS로 동작하기 때문입니다.
PS. ESModule 시스템으로 코드를 바꿔서 작성하셔도 괜찮지만 의도하지 않은 설정 오류가 발생하게 될 수 있습니다!
0
안녕하세요, 인프런 AI 인턴입니다. ab kim님.
Node.js 환경에서 ESM(ECMAScript Module)과 CJS(CommonJS) 모듈 시스템을 함께 사용할 수 있는지에 대한 질문이시군요. 기본적으로 Package.json의 “type”: “module” 설정은 JavaScript 파일들을 ESM 방식으로 취급하게 만듭니다. 하지만 프로젝트 내의 일부 파일에서는 명시적으로 CJS를 사용할 수도 있습니다.
ESM과 CJS 혼용 사용 가능성
파일 확장자 별 구분:
.mjs확장자로 파일을 저장하면 ESM 모듈로 간주합니다.
.cjs확장자로 저장하면 CJS 모듈로 간주합니다.
- 이러한 방식을 통해 특정 파일별로 모듈 시스템을 달리 설정할 수 있습니다.
Node.js 버전에 따른 차이:
- 최신 Node.js 버전에서는 ESM과 CJS 간의 통합이 개선된 부분이 있어 혼용 사용이 가능합니다. 예를 들어, CJS에서 ESM 모듈을 불러올 때 동적 import(
import())를 사용하는 등의 실험적 기능이 존재합니다.
- 최신 Node.js 버전에서는 ESM과 CJS 간의 통합이 개선된 부분이 있어 혼용 사용이 가능합니다. 예를 들어, CJS에서 ESM 모듈을 불러올 때 동적 import(
관련 질문 및 해결방안
아래 링크에서는 npm run start에서 발생할 수 있는 다양한 문제와 혼용 사용 예제에 대해 다루고 있습니다. 추가적인 이해에 도움이 될 것입니다.
- 3.3)Node.js 사용하기 강의 중 npm run start 시 오류 발생
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
존재하지 않는 일기 url입력 시 alert이 두 번 떠요
0
28
1
교재(3쇄)와 강의 내용 문의
0
33
2
12.13) 하단 여백 스타일링 관련 질문 드립니다.
0
66
2
에러 질문드립니다
0
63
2
VSCode 설정 문의
0
67
2
PPT 코드 관련 질문
0
49
2
useEffect와 lifecycle문의
0
64
2
프론트엔드 학습 수준 문의
0
78
2
리액트 챕터별 코드에서 eslint 설정파일이 없어요
0
70
2
데이터 로딩중 화면만 계속 나와요!!
0
72
2
퍼블리셔일경우 어느정도 수준까지 강의를 들어야할까요
0
101
2
이후의 커리큘럼 문의
0
125
2
실슬환경 설정에서 save후 console.log 부분이 새로고침이 안되는현상입니다.
0
72
2
최적화 관련 질문있습니다 (useMemo 등)
0
103
3
프로바이더 컴포넌트의 위치는 어떤 기준인가요?
1
95
3
Date 객체에 관련하여 질문드립니다.
0
96
2
리액트 개정판 교재 질문
0
76
2
예제코드가 안나와요!
0
86
2
select a variant 선택에서 javascript와 javascript+react compiler 중 무엇을 선택해야하나요? com
0
130
2
onMouseEnter 관련 문의 드립니다
0
110
3
배열의 렌더링 관련 질문 드립니다.
0
83
2
2:40초 refObj를 콘솔로 출력시 오류가 발생합니다.
0
133
2
TS, 리액트 강의중에 뭘 먼저 수강하는게 좋을까요?
0
151
2
useCallback 적용한 onCreate, onUpdate, onDelete 함수..
0
73
1