2019. 10. 4. 11:41ㆍWebpack/WORK
Std. 1에서 작업환경설정에 대한 부분을 확인했습니다.
Std. 2에서는 package.json 파일을 생성 후 webpack, babel 등을 설치해 보겠습니다.
1. root 폴더에 package.json 파일생성
package.json 파일에서 npm 의존성 모듈을 관리해줍니다.
*** NPM ***
npm은 전세계 최대의 소프트웨어 라이브러리입니다.
앞으로 사용하는 많은 라이브러리들을 npm을 사용해서 설치하고
프로젝트에 사용한 라이브러리를 package.json 파일에서 관리합니다.
2. webpack 설치
webpack V3 사용하겠습니다.
devDependencies 에 webpack 이 설치됬다는 것을 확인할 수 있습니다.
또한, node_modules 폴더가 생성됩니다. 폴더 안에 webpack을 확인할 수 있습니다.
webpack 테스트를 진행해보겠습니다.
webpack.config.js 파일을 만듭니다.
하나의 파일을 entry 파일로 설정합니다.
home.main.js 파일을 확인해보면 다른 js 파일들을 import 합니다.
작업시에는 각각의 파일로 나누어 모듈별로 작업을 합니다.
webpack 실행은 package.json 파일에 설정할 수 있습니다.
설정 후 터미널에 명령어를 실행합니다.
그리고 webpack을 실행시 dist 폴더에 main.bundle.js 파일이 생성됩니다.
webpack 의 설치 및 기본동작방식입니다.
앞으로 추가적인 설정 및 필요한 라이브러리를 설치하겠습니다.
Git.
https://github.com/imse0109/fetest/commit/306555eba78c519d1932dc3e45631203d9585b52