Webpack

HunGeun·2022년 5월 3일
0

webpack

생성

설치

npm init
npm i -D webpack webpack-cli webpack-dev-server@next
webpack: core
webpack-cli: command line interface
webpack-dev-server: dev-server

config

//import node의 path
const path = require('path')

//export
module.exports = {
    //진입점 설정
    entry: './js/main.js',

    //output
    output: {
        path: path.resolve(__dirname, 'public'), //폴더명 미작성시 dist 생성
      	//__dirname 해당파일의 path를 뜻하는 node.js의 전역변수
        filename: 'main.js' //미작성시 entry와 동일한 이름으로 생성
        clean: true //지난옵션에 만들어진 파일 제거
      	//
    }
}
[webpack entry docs](https://webpack.js.org/configuration/entry-context/#entry-descriptor)

plugin

//설치
npm i -D html-webpack-plugin 

//config 
//import
const HtmlPlugin = require('html-webpack-plugin')
const CopyPlugin = require('copy-webpack-plugin')

plugins: [
    new HtmlPlugin({
        template: './index.html'
    }),
    new CopyPlugin({
      patterns: [
          { from: 'static' }
      ]
  })
]

pull

//degit
npx degit github_name/repository_name dir_name

0개의 댓글