맨동이

유데미 강의를 보며 typescript에 webpack을 적용하였다. 하지만 강의는 webpack 4버전으로 녹화된 강의였고.. 나는 webpack5로 설정을 하던중 다른 부분이 있어 기록으로 남길겸 글을 남기게 되었다. webpack-dev-server ? 빠른 실시간 리로드 기능을 갖춘 개발 서버로서 디스크에 저장되지 않는 메모리 컴파일을 사용하기 때문에 컴파일 속도가 빨라지고, webpack.config.js파일에 devServer 옵션으로 커스터마이징도 가능하다. 22년 3월 기준 npm install 버전과 나의 프로젝트 구성 목록이다. npm start로 실행했을 시에는 webpack-dev-server가 실행되게 하고, build시에는 따로 build용 config 파일을 만들어 적용해주었다..

참조 https://ko.parceljs.org/cli.html#%EB%AA%85%EB%A0%B9%EC%96%B4 🖥 커맨드 라인 인터페이스(CLI) 시작하기 기능 📦 애셋 유형 고급 🖥 커맨드 라인 인터페이스(CLI) 명령어 Serve 개발용 서버를 시작합니다. 앱이 수정되면 자동으로 다시 빌드하고, 빠른 개발을 위해 빠른 모듈 교체를 지원합니 ko.parceljs.org Serve 개발용 서버를 시작합니다. 앱이 수정되면 자동으로 다시 빌드하고, 빠른 개발을 위해 빠른 모듈 교체를 지원합니다. 더보기 parcel index.html Build 애셋을 한 번 빌드합니다. 이 과정에서 코드 최소화(미니파이케이션)가 활성화되고 환경변수가 NODE_ENV=production 로 설정됩니다. 프로덕션에서 보다..

Parcel 2017년 여름에 등장한 Parcel.js는 새로운 웹 애플리케이션 번들러 입니다. 기존에 많이 사용하던 Webpack이나 Gulp와 다르게 별도 설정 없어도 빠르게 빌드가 가능합니다. 구성 없는 단순한 자동 번들링 소/중형 프로젝트에 적합합니다. Parcel-bundler 설치 NPM 설치 더보기 더보기 npm install -g parcel-bundler Yarn 설치 더보기 더보기 yarn global add parcel-bundler SCSS/ SASS 사용 SCSS 컴파일은 sass (dart-sass의 JS 버전) 모듈을 필요로 합니다. NPM 설치 더보기 더보기 npm install -D sass Yarn 설치 더보기 더보기 yarn add -D sass 설치가 완료되면 Java..