webpack核心概念

配置檔案？

是webpack打包的依據，webpack如何打包，打包成什麼樣，全都有配置檔案指定

對於webpack，我們的主要工作也是編寫，配置webpack的配置檔案

1、entry

module.exports=,

entry:
}

module.exports=,

output:
}

指定path

3、loader- 是webpack的編譯方法

webpack自身至只能處理js，所以對別的資源需要loader

webpack自身只能負責打包，相關的編譯等操作，需要loader

loader本質是乙個方法，使用時大多需要額外安裝

module.exports=//}

//use: [
//{}//]
}       ]}}

css-loader，style-loader 等css處理loader

url-loader，image-loader等字型檔案等資源處理loader

les-loader ，sass-loader，babel-loader等編譯loader

初次之外還有很多語法糖loader，比如vue-loader

4、plugin- 提供給webpack的一系列額外擴充套件

一些外掛程式式的額外功能由plugin定義，幫助webpack優化**，提供功能

plugin有的是webpack自帶的，也有需要額外安裝的

module.exports=

commonchunkplugin(提取公共模組)，uglifyjswebpackplugin(減小js體積，簡寫，壓縮等)，purifycss(css體積)等優化檔案體積的外掛程式

htmlwebpackplugin(把打包結果檔案自動引入到html中)，hotmodulereplacementplugin(熱更新)等額外功能的外掛程式　　　　

webpack核心概念

1.manifest webpack中runtime和manifest主要用於管理所有模組的互動，主要是用於連線模組化應用程式的所有代 碼。runtime包含 在模組互動時，連線模組所需的載入和解析邏輯，包括瀏覽器中已載入模組的連線以及懶載入模組的執行連線。管理模組互動的流程 當編譯器 compil...

webpack 核心概念

核心概念 entry 打包的入口 output 打包的輸出 loaders webpack 處理js 之外的東西，就是使用的loaders plugins webpack 其它功能 比如壓縮 分割 等就是通過plugins 來完成的 entry 的入口 某段 的入口，這個入口會說明這段 所有的依賴 ...

webpack核心概念

打包流程的開始需要乙個入口，用於指定webpack的打包起點，webpack會從入口開始處理工程依賴，構建模組 module 之間的依賴關係樹，這些依賴關係模組在打包時被webpack封裝為chunk，隨後webpack會將chunk打包為bundle 資源入口的路徑字首，在配置時要求必須使用絕對路...