前端工程化

• 模組化（js 的模組化、css的模組化、資源的模組化）
• 元件化（複用現有的UI結構、樣式、行為）
• 規範化（目錄結構的劃分、編碼規範化、文件規範化、Git分支管理）
• 自動化（自動化構建、自動化部署、自動化測試）

什麼是前端工程化

前端工程化指的是：在企業級的前端專案開發中,把前端開發所需的工具、技術、流程、經驗等進行規範化、標準化
企業中的Vue專案和React專案，都是基於工程化的方式進行開發的。
好處：前端開發自成體系，有一套有一套標準的開發方案和流程

前端工程化的解決方案：

早期的前端工程化解決方案

• grunt(http://www.gruntjs.net/)
• gulp(http://wwww.gulpjs.com.cn/
  )
  
  

目前主流的前端工程化解決方案：

• webpack(https://www.webpackjs.com/)
• parcel(https://zh.parceljs.org/)
  
  

webpack的基本使用

什麼是webpack

概念webpack是前端專案工程化的具體解決方案。

主要功能：它提供了友好的前端模組化開發支援，以及程式碼壓縮混淆、處理瀏覽器端JavaScript的相容性、效能優化等強大功能。

好處：讓程式設計師工作的重心放到具體功能的實現上，同奧了前端開發效率?和專案的可維護性。

在專案中安裝webpack

在終端執行如下命令，安裝webpack相關的兩個包：

npm install [email protected] [email protected] -D