webpack(一)安裝

webpack?

webpack是一個模塊打包器,它將根據模塊的依賴關係進行靜態分析,然後將這些模塊按照指定的規則生成對應的靜態資源。

打包核心原理:分塊傳輸,按需進行懶加載,在實際用到某些模塊的時候再增量更新,纔是較爲合理的模塊加載方案。要實現模塊的按需加載,就需要一個對整個代碼庫中的模塊進行靜態分析、編譯打包的過程、分析出各個模塊的類型和它們依賴關係,然後將不同類型的模塊提交給適配的加載器來處理。比如一個用 less寫的樣式模塊,可以先用 less加載器將它轉成一個css模塊,在通過 css 模塊把他插入到頁面的 style 標籤中執行。webpack 就是在這樣的需求中應運而生。

webpack的工作原理:webpack 會分析入口文件,解析包含依賴關係的各個文件。這些文件(模塊)都打包到 bundle.js 。Webpack 會給每個模塊分配一個唯一的 id 並通過這個 id 索引和訪問模塊。在頁面啓動時,會先執行 entry.js 中的代碼,其它模塊會在運行 require 的時候再執行。

windows下的安裝

由於webpack是依賴npm的,所以需要先安裝node.js環境,node裏面內置了npm包管理器相關的模塊。
首先通過npm安裝全局環境:

npm install webpack -g  //安裝
npm uninstall webpack --save-dev  //卸載

此時 Webpack 已經安裝到了全局環境下,可以通過命令行 webpack -h查看相關的命令。

發佈了29 篇原創文章 · 獲贊 78 · 訪問量 11萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章