一、什麼是webpack?
webpack是乙個模組打包工具。
用vue專案來舉例：瀏覽器它是只認識js，不認識vue的。而我們寫的**字尾大多是.vue的，在每個.vue檔案中都可能html、js、css甚至是資源；並且由於元件化，這些.vue檔案之間還有錯綜複雜的關係。所以專案要被瀏覽器識別，我們就要使用webpack將它們打包成js檔案以及相應的資源檔案。
二、webpack的功能？
1、它可以吧css，js當做模組來處理
2、它可以吧以上的這些檔案進行打包壓縮成乙個js檔案，減少了http的請求
3、根據模組之間的依賴關係進行分析，按需載入
4、可以安裝一些外掛程式，對外掛程式進行打包處理
三、安裝
npm install webpack -g(全域性的安裝)
webpack -v #檢視是否安裝成功打包的方式：
手動打包：
a.js自動打包：webpack a.js /test/a2.js
四、簡單使用
這裡我們來理解下webpack是如何打包的
var tcl = "this is webpack test";執行命令console.log(tcl);
require('style-loader!css-loader!./a.css');
就會自動生成乙個b.js的檔案，現在就可以使用並匯入了
一、什麼是webpack?
webpack是乙個模組打包工具。
用vue專案來舉例：瀏覽器它是只認識js，不認識vue的。而我們寫的**字尾大多是.vue的，在每個.vue檔案中都可能html、js、css甚至是資源；並且由於元件化，這些.vue檔案之間還有錯綜複雜的關係。所以專案要被瀏覽器識別，我們就要使用webpack將它們打包成js檔案以及相應的資源檔案。
二、webpack的功能？
1、它可以吧css，js當做模組來處理
2、它可以吧以上的這些檔案進行打包壓縮成乙個js檔案，減少了http的請求
3、根據模組之間的依賴關係進行分析，按需載入
4、可以安裝一些外掛程式，對外掛程式進行打包處理
三、安裝
npm install webpack -g(全域性的安裝)
webpack -v #檢視是否安裝成功打包的方式：
手動打包：
a.js自動打包：webpack a.js /test/a2.js
四、簡單使用
這裡我們來理解下webpack是如何打包的
var tcl = "this is webpack test";執行命令console.log(tcl);
require('style-loader!css-loader!./a.css');
就會自動生成乙個b.js的檔案，現在就可以使用並匯入了
webpack打包工具
終端執行 yarn webpack或者 在package.json中加入 scripts 開發模式 yarn webpack mode development原始模式 yarn webpack mode none在webpack.config.js中增加mode的模式 mode developmen...
webpack打包工具
目的 平時小專案中例如一些 需要進行打包壓縮，用這個工具可以進行打包壓縮，就可以上傳到伺服器。使用方法 1，引進需要打包的專案，把入口html替換掉專案中的index.html，把引進的js，css都放在src裡面對應的資料夾裡面 2，npm install 3，進行webpack.config.j...
Webpack打包工具詳解
webpack是一種前端資源構建工具 乙個靜態模組打包器 在webpack看來 前端所有資源檔案都會作為模組處理 他將根據模組的依賴關係進行靜態分析 打包生成對應的靜態資源 webpack 可以做到按需載入。像 grunt gulp 這類構建工具，打包的思路是 遍歷原始檔 匹配規則 打包，這個過程中...