為啥要使用webpack呢窝剖？webpack又是啥？
- 沒(méi)有項(xiàng)目開(kāi)發(fā)經(jīng)驗(yàn)的你酥夭，可以先把他看做是一個(gè)日后開(kāi)發(fā)會(huì)用到的一個(gè)好工具
- 有過(guò)開(kāi)發(fā)經(jīng)驗(yàn)的赐纱，應(yīng)該對(duì)他有所了解
- 話(huà)不多說(shuō)脊奋，先讓我們使用一下
1. webpack的安裝
1.1安裝之前的工作
-
在你的開(kāi)發(fā)工具中創(chuàng)建一個(gè)文件夾，我的是app,在這個(gè)文件夾內(nèi)打開(kāi)命令窗口疙描，輸入指令：
npm init
image.png 之后 咋們就要開(kāi)始安裝了輸入指令
npm i webpack --save-dev
*注意：安裝完?yáng)|西的時(shí)候诚隙，咋們就要檢查是否安裝成功
輸入指令 webpack -v 進(jìn)行檢查 ，之后可能會(huì)報(bào)錯(cuò)讓你安裝 webpack-cli (原因是你現(xiàn)在安裝的webpack的版本很高了起胰，把webpack *** 的指令全都扔給了webpack-cli,所以你在使用webpack 指令的時(shí)候需要安裝一下 webpack-cli)
- 若沒(méi)有安裝成功久又，則請(qǐng)輸入這條指令
npm i webpack-cli --save-dev - 繼續(xù)用
webpack -v檢查是否安裝成功 - 成功則繼續(xù)往下看就好了，沒(méi)有成功則繼續(xù)輸入指令
npm i -g webpack-cli - 這下效五，進(jìn)行驗(yàn)證應(yīng)該就沒(méi)有什么問(wèn)題了地消，如果再有問(wèn)題，請(qǐng)把自己之前的安裝刪除之后再?gòu)氐鬃咭幌律厦娴陌惭b流程畏妖。如果還有問(wèn)題歡迎交流脉执。
-
成功結(jié)果
image.png
安裝成功之后，我們就開(kāi)始使用吧戒劫！
- 首先在app文件夾內(nèi)創(chuàng)建一個(gè)hello(隨意你喜歡的名稱(chēng)).js
- 在app路徑下的命令行中輸入指令
webpack hello.js -o bundle.js
image.png - 這個(gè) -o是webpack4的新指令半夷，在隨后的的學(xué)習(xí)中，你就會(huì)慢慢的理解的迅细。
這就是初步的使用了巫橄，下次的webpack配置，我們?cè)偌s疯攒。一起加油班滤妗！
