# CommonJS

32개의 포스트

commonjs 방식 과 ESM 방식, AMD

nodejs가 채택하고 있는 방식이 commonjs이다.모듈을 호출하는 방식은 require이다.동기적으로 작동한다.내보내는 방식이 module.exports이다.조금 더 익숙한 import, export방식이다.node 12부터 esm방식을 공식 지원함.비동기적으로

6일 전
·
0개의 댓글
·
post-thumbnail

[JavaScript] : 자바스크립트 모듈 시스템

JavaScript 모듈 시스템

2022년 11월 29일
·
0개의 댓글
·

[Node.js] 모듈

전체를 이루는 부품 하나하나Node.js에서는 JavaScript 파일 하나를, 하나의 모듈이라고 생각하면 된다모듈들이 모여서 하나의 프로그램이 된다하나의 모듈에서 다른 모듈을 가져다 쓰는 법을 배우는 것이 핵심모듈은 '내가 직접 만든 모듈'과 '이미 만들어져 있는 모

2022년 11월 16일
·
0개의 댓글
·
post-thumbnail

BE_intro_2. Node.js의 기능_10.25

모듈 = LEGO 블록LEGO 블록: 독립적 존재, 사용자의 조립방법과 블록 종류에 따라 여러 결과물될 수 있음모듈: 코드의 조각, 여러 모듈을 모아 하나의 소프트웨어가 됨코드의 모듈화가 중요한 이유? 유지보수가 쉬운 구조 만들기 위해!=비용 감소, 생산성 증대but

2022년 10월 25일
·
0개의 댓글
·
post-thumbnail

FEConf 2022 후기 (feat. 내 import문이 그렇게 이상했나요?)

FEConf 2022를 다녀왔다.https://2022.feconf.kr/티켓팅은 정말.. 아이돌 콘서트를 방불케 할 정도였다.회사 동료들과 네 명이서 도전했는데 두 명만 성공했다..! 그 중 한 명이 나라니 감사합니다 ㅠ\_ㅠ세션도 정말 알차서 고민이 되었지

2022년 10월 10일
·
0개의 댓글
·
post-thumbnail

CommonJS 와 ES Modules 의 번들 크기 비교

https://web.dev/commonjs-larger-bundles/ 의 예시 코드를 직접 돌려본 결과 입니다.https://github.com/youngkiu/cjs-vs-esm-size

2022년 10월 2일
·
0개의 댓글
·

모듈 시스템(CommonJS, AMD, UMD, ES6)

모듈이란 여러 기능들에 관한 코드가 모여있는 하나의 파일

2022년 7월 4일
·
0개의 댓글
·

CommonJS, esModule 번들링 결과 비교하기

타입스크립트와 웹팩을 이용하여 CommonJS와 esModule의 차이점을 비교하려고 합니다. 그전에 자바스크립트가 지원하는 모듈이 정확히 무엇인지 모르시다면 링크를 봐주시기 바랍니다. 이 포스트를 쓰게 된 이유는 문든 tsconfig.json에서 module을 수정하다가 CommonJS, ES2015, ... , ESNext 등 종류가 많은데 무엇을 사용...

2022년 5월 1일
·
0개의 댓글
·

자바스크립트 module

안녕하세요. tsconfig와 webpack에서 commonJS와 esModule의 컴파일 결과를 정리하는 도중, 기본적인 지식을 먼저 익혀야 된다고 생각이 들었습니다(이는 추후에 새로운 글로 소개 드리겠습니다). 바로 자바스크립트에서 module이 어떻게 동작하는지

2022년 4월 22일
·
0개의 댓글
·
post-thumbnail

[에러] Heroku 배포 후 Internal Server Error

문제 Express 앱에서, ES6를 ES5로 바꾸는 방법에는 babel src -d build && node build/index.js 말고도 nodemon --exec node_modules/.bin/babel-node src/index.js 가 있다는 것을 알

2022년 3월 1일
·
0개의 댓글
·

CommonJS vs ES Modules

CommonJS app.js ES Modules app.js package.json

2022년 2월 25일
·
0개의 댓글
·
post-thumbnail

모듈 시스템과 Webpack(1)

리액트를 공부하고, 리액트 프로젝트를 진행하며 모듈 시스템을 이용해 컴포넌트 주도 개발을 할 때 Webpack과 같은 번들러의 역할이 중요하다는 것을 알게 되었다. 이 글을 통해서 리액트 개발 시 웹팩이 필요한 이유와 웹팩 설정 방법을 정리해본다...

2022년 2월 8일
·
0개의 댓글
·

import from vs const require

개발을 하다보면 모듈을 불러올 때 이 두가지를 마주하는 경우가 많다.뭔가 다른 것 같고, 또 실제로 혼용하거나 잘못 사용하면 에러가 나는 경우가 다반사이다.하지만 뭔지도 모르고 그냥 지나쳐서 사용했던 이 두 친구들을 정리해보려 한다.더 최신 스펙인 ES6 모듈 시스템을

2021년 11월 24일
·
0개의 댓글
·

webpack + babel

모듈단위의 js들을 모아서 하나의 app.js로 번들링해주는 기능 크로스브라우징을 위해 es6문법으로 작성된 js를 es5로 변환해주는 기능루트폴더에 npm init을 해준다.\*이때 폴더에 package.json파일이 생겨남웹팩과 바벨을 설치해준다 \*웹팩 바벨은 개

2021년 11월 12일
·
0개의 댓글
·
post-thumbnail

DEEP DIVE 한 장 요약 (모듈)

모듈(module)이란 애플리케이션을 구성하는 개별적 요소로서 재사용 가능한 코드 조각을 말한다.일반적으로 모듈은 기능을 기준으로 파일 단위로 분리한다. 이때 모듈이 성립하려면 모듈은 자신만의 파일 스코프(모듈 스코프)를 가질 수 있어야 한다.자신만의 파일 스코프를 갖

2021년 9월 8일
·
0개의 댓글
·

CommonJS 이해하기

exports는 변수나 함수의 이름을 그대로 사용해서 내보낸다. NamedExports라고 일컫는다.module.exports와 exports는 같은 객체를 참조한다. 같은 문법이다.보통 하나의 객체에 모아서 내보낸다.babel이 없는 환경에서 ES모듈을 사용한다면 i

2021년 6월 7일
·
1개의 댓글
·

MYSTAGRAM 제작기 5

이번에는 개발에 도움이 되는 tool에 관하여 작성할 것이다. > prisma studio 데이터 베이스를 시각화해서 보여준다. 검색에 용이하고 수정도 가능하다. 위의 명령어로 실행할 수 있다. > graphql-tools graphql-tools은 스키마와 re

2021년 5월 22일
·
0개의 댓글
·
post-thumbnail

[node.js] 모듈 사용하기 (Common JS)

브라우저와 다르게 node.js의 특징 중 하나는, 다양한 내장 모듈이 존재한다는 것입니다. 따라서, 이를 가져다 쓸 수 있는 방법을 배워야 합니다. 브라우저에서는 다른 스크립트 파일을 불러올 때에, HTML의 태그를 이용했습니다. 반면에 node.js 에서는 HTM

2021년 4월 9일
·
0개의 댓글
·
post-thumbnail

TIL_210407

화살표 함수모듈화CommonJS화살표 함수는 function 키워드를 화살표로 축약해서 표시하는 방법이다. ES6부터 새로 도입되었다.위와 같이 작성된 것을 화살표 함수라고 부르는데, 함수 표현식과 비교하면 한 눈에 확인할 수 있다.함수 표현식화살표 함수화살표 함수는

2021년 4월 7일
·
0개의 댓글
·