【譯】webpack正式發佈v3.0.0

原文連接： webpack 3: Official Release!!

做者：Sean T. Larkin

翻譯：野草

發佈webpack 2以後，咱們就跟社區承諾：咱們將發佈你們投票出來的功能特性，並且會保證更快更穩定的發佈週期。

不會再有一年纔出來的測試版本，不會再有不兼容的重大改變。咱們承諾咱們會保證你們的權益，由於大家才使得wepack如此欣欣向榮。

如今webpack團隊很自豪地跟你們宣佈，今天（2017.06.20）正式發佈了webpack 3.0.0！如今就能夠下載升級了！！！

npm install webpack@3.0.0 --save-dev

或者

yarn add webpack@3.0.0 --dev

從webpack 2遷移到webpack 3只須要上述簡簡單單的一條命令行就完成升級。因爲webpack內部的一些會影響到插件的大更改，咱們把這個版本定爲全新的版本號。

新特性

如上所述，咱們更新的是大家投票出來的特性。正由於Github上龐大的代碼貢獻，贊助者以及擁護者的支持，咱們才得以一一擊破這些新特性。

做用域提高（Scope Hoisting）

做用域提高是wepack 3的核心特性。webpack在打包時會把每一個模塊用單獨的閉包封裝起來，這些閉包會減速代碼的執行過程，但這是webpack在性能和？？之間做出的一個權衡。相比之下，諸如Closure Compiler和RollupJS之類的打包工具「提高」或者說打通了全部模塊的做用域，將文件打包到一個閉包函數中，提升了代碼的執行速度。

如今有了webpack 3，能夠在配置上中添加以下插件來實現做用域提高的功能：

module.exports = {  
  plugins: [
    new webpack.optimize.ModuleConcatenationPlugin()
  ]
};

做用域提高是ECMAScript標準中模塊的新語法。webpack打包也可能會回退到常規的打包策略，這取決於你採用的是哪一種模塊語法（ES模塊語法仍是其餘模塊語法），固然還有其餘條件。

想知道回退的緣由，能夠添加--display-optimization-bailout屬性，它會在回退的時候通知你並顯示緣由。

因爲做用域提高移除了模塊的閉包函數，打包後的代碼可能會變小。不過，最關鍵的提高點是代碼執行速度。若是你有很好的對比例子，能夠告訴咱們，咱們很樂意與你們分享。

魔法註釋（Magic Comments）

當咱們告訴你們webpack 2能夠使用動態引入語法（import()）的時候，開發者反饋說它不能像require.ensure同樣命名打包以後文件的名字。

如今咱們引入了社區所謂的魔法註釋特性，它能讓開發者在import()語句中之內聯註釋的方式傳入打包後文件的名字，以及其餘更多配置。

import(/* webpackChunkName: "my-chunk-name" */ 'module');

這些特性在webpack 2.4 和 2.6 版本中已經發布，可是v3版本修復了已有的bug，保證了特性的穩定性。如今，咱們能夠像使用require.ensure同樣靈活地使用動態引入語法了。

想了解更多，點擊查看咱們最新的「代碼分割」官方文檔。

下一步

咱們但願帶給大家更多的新特性和原有代碼改善。點擊投票頁面，選出你最期待的特性，咱們將根據你們的意願來優先完善。

如下是咱們正在作的：

• 更好的構建緩存

• 更快的初次和漸進構建體驗

• 更好的TypeScript體驗

• 長期緩存改進

• WASM模塊支持

• 用戶體驗提高

附錄

Git倉庫上列出列 webpack 2.6.1到wepback 3.0.0的新特性：

• node_modules no longer mangle to ~ in stats(重大改變)

• HMR請求可配置超時時間

• 新增試驗性特性做用域提高

• 性能提高

• 新增output.libraryExport配置導出的庫

• sourceMapFilename支持[contenthash](重大改變)

• module.noParse支持函數

• 新增node: false配置項使全部node配置失效