一、Install

1.全局安裝

npm install webpack webpack-cli -g

2.局部安裝

以項目為單位，一個項目一個webpack版本
如果文件里有中文使用npm init ，如果沒有使用npm init -y

進(jìn)入項目目錄

//當(dāng)在開放環(huán)境使用這個
npm install webpack webpack-cli -D//當(dāng)在生產(chǎn)環(huán)境后
npm install webpack webpack-cli

二、總結(jié)

1.打包

對項目進(jìn)行打包

//可以這樣使用，但很奇怪
npx webpack

2.定義腳本

//執(zhí)行腳本
npm run build

3.配置文件定義（webpack.config.js)

打包會默認(rèn)的入口文件是src/index.js文件，出口文件是dist。當(dāng)想要修改名字時可以自行修改

4.項目重新加載依賴

刪掉node_module復(fù)制一份，然后不需要在安裝webpack，因為在package.json里有依賴項

//直接使用指令
npm install

5.webpack打包Css

webpack本身并不認(rèn)識css，需要借助loader

1. 安裝Css loader

npm install css-loader -D

2. 無法直接使用，需要設(shè)置關(guān)聯(lián)loader,在webpack.config.js中添加或者修改關(guān)聯(lián)

    module:{rules:[{test:/\.css$/,loader:"css-loader"}]}

6.style-loader

如果只引入關(guān)聯(lián)css-loader，那么無法生效，因為它只負(fù)責(zé)解析，并不會將css插入頁面
那么就需要來引入style-loader

npm install style-loader -D

修改配置文件

                use:["style-loader","css-loader"]