一.webpack 的基本概念
webpack 本質上是乙個打包工具，它會根據**的內容解析模組依賴，幫助我們把多個模組的**打包。借用 webpack 官網的： 如上圖，webpack 會把我們專案中使用到的多個**模組（可以是不同檔案型別），打包構建成專案執行僅需要的幾個靜態檔案。 webpack 有著十分豐富的配置項，提供了十分強大的擴充套件能力，可以在打包構建的過程中做很多事情。 我們先來看一下 webpack 中的幾個基本概念。
如上圖所示，在多個**模組中會有乙個起始的 .js 檔案，這個便是 webpack 構建的入口。 webpack 會讀取這個檔案，並從它開始解析依賴，然後進行打包。如圖，一開始我們使用 webpack 構建時，預設的入口檔案就是 ./src/index.js。 我們常見的專案中，如果是單頁面應用，那麼可能入口只有乙個；如果是多個頁面的專案，那麼經常是乙個頁面會對應乙個構建入口。 入口可以使用 entry 欄位來進行配置，webpack 支援配置多個入口來進行構建：
module.exports =
// 上述配置等同於
module.exports =
} // 或者配置多個入口
module.exports =
} // 使用陣列來對多個檔案進行打包
module.exports =
}複製**
### 1.2 loader webpack 中提供一種處理多種檔案格式的機制，便是使用 loader。我們可以把 loader 理解為是乙個轉換器，負責把某種檔案格式的內容轉換成 webpack 可以支援打包的模組。
舉個例子，在沒有新增額外外掛程式的情況下，webpack 會預設把所有依賴打包成 js 檔案，如果入口檔案依賴乙個 .hbs 的模板檔案以及乙個 .css 的樣式檔案，那麼我們需要 handlebars-loader 來處理 .hbs 檔案，需要 css-loader 來處理 .css 檔案（這裡其實還需要 style-loader，後續詳解），最終把不同格式的檔案都解析成 js **，以便打包後在瀏覽器中執行。
module.exports = ,],}
}複製**
loader 是 webpack 中比較複雜的一塊內容，它支撐著 webpack 來處理檔案的多樣性。後續我們還會介紹如何更好地使用 loader 以及如何開發 loader。在 webpack 的構建流程中，plugin 用於處理更多其他的一些構建任務。可以這麼理解，模組**轉換的工作由 loader 來處理，除此之外的其他任何工作都可以交由 plugin 來完成。通過新增我們需要的 plugin，可以滿足更多構建中特殊的需求。例如，要使用壓縮 js **的 uglifyjs-webpack-plugin 外掛程式，只需在配置中通過 plugins 字段新增新的 plugin 即可：
const uglifyplugin = require('uglifyjs-webpack-plugin')
module.exports =
複製**
除了壓縮 js **的 uglifyjs-webpack-plugin，常用的還有定義環境變數的 defineplugin，生成 css 檔案的 extracttextwebpackplugin 等。在這裡提到這些 plugin，只是希望讀者們能夠對 plugin 的作用有個大概的印象，後續的小節會詳細介紹如何使用這些 plugin。
plugin 理論上可以干涉 webpack 整個構建流程，可以在流程的每乙個步驟中定製自己的構建需求。第 15 小節我們會介紹如何開發 plugin，讓讀者們在必要時，也可以在 webpack 的基礎上開發 plugin 來應對一些專案的特殊構建需求。
webpack 的輸出即指 webpack 最終構建出來的靜態檔案，可以看看上面 webpack 官方右側的那些檔案。當然，構建結果的檔名、路徑等都是可以配置的，使用 output 字段：
module.exports = ,
} // 或者多個入口生成不同檔案
module.exports = ,
output: ,
} // 路徑中使用 hash，每次構建時會有乙個不同 hash 值，避免發布新版本時線上使用瀏覽器快取
module.exports = ,
}複製**
我們一開始直接使用 webpack 構建時，預設建立的輸出內容就是 ./dist/main.js。
webpack的構建（高階）
webpack dev server 打包檔案後的儲存 在享受webpack自動更新重啟的過程時 你會忽然發現網頁上的資料卻沒有更新 其實.webpack dev server幫我們打包生成的bundle.js檔案，並沒有存放到 實際的物理磁碟上 而是，直接託管到了電腦的記憶體中，所以，我們在 專案...
11 Golang基礎高階 指標
每個變數都有記憶體位址，可以理解為變數來操作對應的記憶體，go語言的取位址符是 放到乙個變數前使用就會返回相應變數的記憶體位址，符跟指標型別息息相關 func main 指標型別，變數存的是乙個位址，這個位址存的才是值 獲取指標型別所指向的值，使用 示例 func main var 指標變數名 指標...
webpack2 webpack的基礎配置
1.webpack的安裝 webpack一般是本地安裝，也就是在自己所需要的專案中進行安裝，需要安裝的包有兩個 webpack webpack cli d d表示安裝的是依賴，在專案上線的時候不需要載入 注 專案初始化的時候，可以直接使用命令 cnpm init y他與之前使用的cnpm init的...