摘要：我們發(fā)布了新版本的插件系統(tǒng)，以便事件掛鉤和處理程序是單態(tài)的。倒計(jì)時(shí)按照承諾，我們將從今天開(kāi)始等待一個(gè)月，然后再釋放穩(wěn)定版。這為我們的插件，加載程序和集成生態(tài)系統(tǒng)提供了測(cè)試，報(bào)告和升級(jí)到的時(shí)間我們需要您幫助我們升級(jí)并測(cè)試此測(cè)試版。

自8月初以來(lái)—當(dāng)我們將 nex branch?合并到webpack/webpack#master—我們看到了巨大的貢獻(xiàn)！

?今天，我們很自豪地發(fā)布webpack 4.0.0-beta.0來(lái)分享這項(xiàng)工作的成果！ ?

當(dāng)我們完成webpack 3的發(fā)布后，我們向社區(qū)承諾，我們會(huì)在主要版本之間為您提供更長(zhǎng)的開(kāi)發(fā)周期。

我們已經(jīng)實(shí)現(xiàn)了這個(gè)承諾[并繼續(xù)實(shí)現(xiàn)它]，為您帶來(lái)一系列功能，改進(jìn)和錯(cuò)誤修復(fù)，我們已經(jīng)等不及想要你試試這些新功能了！以下就講講如何開(kāi)始！

如果你使用的是yarn:

yarn add webpack@next webpack-cli --dev

或者 npm:

npm install webpack@next webpack-cli --save-dev

在測(cè)試webpack 4時(shí)，越來(lái)越多的人嘗試將reporting plugin和 loader程序不兼容，我們就可以構(gòu)建一個(gè)生動(dòng)的移植指南。

因此，我們需要您查看 官方更改日志 以及 我們的遷移草案 并在我們有遺漏的地方提供反饋! 這將幫助我們的文檔團(tuán)隊(duì)創(chuàng)建我們的官方穩(wěn)定版本遷移指南！

以下是一些您想要知道的以及一些更值得注意的功能. 有關(guān)更改功能和內(nèi)部API修改的完整列表 請(qǐng)參閱我們的更改日志!!!

在webpack 4的多種場(chǎng)景中，性能將顯著增強(qiáng)。以下是我們?yōu)閷?shí)現(xiàn)此目標(biāo)而做出的一些顯著變化：

默認(rèn)情況下，在使用 production 模式時(shí)，我們將自動(dòng)并行化并緩存由UglifyJS完成的縮小工作。

我們發(fā)布了新版本的插件系統(tǒng)，以便事件掛鉤和處理程序是單態(tài)的。

此外，webpack現(xiàn)在已經(jīng)放棄了對(duì)Node v4的支持，使我們能夠添加大量較新的ES6語(yǔ)法和數(shù)據(jù)結(jié)構(gòu)，并且也通過(guò)V8進(jìn)行了優(yōu)化。到目前為止，我們已經(jīng)看到9小時(shí)12分鐘的真實(shí)報(bào)道！

PS: 我們甚至還沒(méi)有實(shí)現(xiàn)全緩存和并行性 ? [webpack 5里程碑]

直到今天，webpack一直要求您明確設(shè)置您的輸入和輸出屬性。使用webpack 4，webpack會(huì)自動(dòng)假設(shè)您的入口屬性為./src/，并且默認(rèn)情況下，bundle將輸出為./dist。

這意味著 您不再需要配置就可以開(kāi)始使用webpack!!

現(xiàn)在webpack是＃0CJS（Zero Configuration）開(kāi)箱即用的打包程序，我們將在4.x和5.0中奠定基礎(chǔ)，以便在將來(lái)提供更多的默認(rèn)功能。

您現(xiàn)在必須在兩種模式之間選擇（模式或 - 模式）：“production” 或者“development”.”。

生產(chǎn)模式為您提供各種優(yōu)化。這包括縮小，范圍提升，抖動(dòng)，無(wú)副作用的模塊修剪，并且包括必須像NoEmitOnErrorsPlugin一樣手動(dòng)使用的插件。

開(kāi)發(fā)模式針對(duì)速度和開(kāi)發(fā)人員的體驗(yàn)進(jìn)以同樣的方式，我們會(huì)自動(dòng)在您的包輸出中包含路徑名稱等功能，eval-source-maps，這些功能是為了易于閱讀代碼和快速構(gòu)建！

我們?cè)趐ackage.json中引入了對(duì)sideEffects：false。添加此字段時(shí)，它會(huì)向webpack發(fā)送信號(hào)，表明庫(kù)中沒(méi)有正在使用的sideEffects。這意味著webpack可以安全地消除代碼中使用的任何重新導(dǎo)出。

例如，僅從lodash-es作為single_export_導(dǎo)入將花費(fèi)約223 KiB [壓縮后]。在webpack 4中，這個(gè)代價(jià)現(xiàn)在是?3 KiB！

當(dāng)您使用ESModule語(yǔ)法導(dǎo)入JSON時(shí)，webpack將從“JSON模塊”中消除未使用的導(dǎo)出。對(duì)于那些已經(jīng)將大量未使用的片段導(dǎo)入到代碼中的人來(lái)說(shuō)，你會(huì)發(fā)現(xiàn)你的包的大小會(huì)顯著減小。

這意味著您可以使用ES6語(yǔ)法，將其縮小，而無(wú)需第一個(gè)轉(zhuǎn)譯器。

我們要感謝UglifyJs2團(tuán)隊(duì)的貢獻(xiàn)者為實(shí)現(xiàn)ES6支持所做的無(wú)私和努力工作。這不是一件容易的事情，我們很樂(lè)意讓你去看看他們的 repository 并表達(dá)你的贊賞和支持

歷史上，JavaScript是webpack中唯一的一流模塊類型。這給用戶帶來(lái)了很多尷尬的痛苦，他們無(wú)法有效地使用CSS / HTML Bundle等?，F(xiàn)在我們從代碼庫(kù)中抽象出JavaScript特性，以允許這個(gè)新的API。我們現(xiàn)在有5個(gè)模塊類型實(shí)現(xiàn)：

javascript/auto:_（在webpack 3中的默認(rèn)值_）_已啟用所有模塊系統(tǒng)的Javascript模塊：CommonJS，AMD，ESM

javascript/esm: EcmaScript模塊，所有其他模塊系統(tǒng)都不可用_（默認(rèn)為.mjs文件）_

javascript/dynamic: 只有CommonJS和AMD; EcmaScript模塊不可用

json: JSON數(shù)據(jù)，它可以通過(guò)require和import （默認(rèn)的.json文件）

webassembly/experimental: WebAssembly模塊 （當(dāng)前為.wasm文件的實(shí)驗(yàn)文件和默認(rèn)文件）

此外，webpack現(xiàn)在按此順序查找.wasm，.mjs，.js和.json擴(kuò)展名以解析

這個(gè)功能最令人興奮的是，現(xiàn)在我們可以繼續(xù)使用CSS和HTML模塊類型（4.x）。這將允許像HTML這樣的功能成為您的入門點(diǎn)！

默認(rèn)情況下，Webpack支持導(dǎo)入和導(dǎo)出任何本地WebAssembly模塊。這意味著您還可以編寫(xiě)裝載器，以便您直接導(dǎo)入Rust，C ++，C和其他WebAssembly主機(jī)lang文件：

我們還刪除了CommonsChunkPlugin并默認(rèn)啟用了其許多功能。另外，對(duì)于那些需要對(duì)其緩存策略進(jìn)行細(xì)粒度控制的用戶，我們添加了更豐富，更靈活的一組功能optimization.splitChunks和optimization.runtimeChunk

還有更多的功能，我們強(qiáng)烈建議您在我們的 官方日志中中查看所有功能。

按照承諾，我們將從今天開(kāi)始等待一個(gè)月，然后再釋放webpack 4穩(wěn)定版。這為我們的插件，加載程序和集成生態(tài)系統(tǒng)提供了測(cè)試，報(bào)告和升級(jí)到webpack 4.0.0的時(shí)間！

我們需要您幫助我們升級(jí)并測(cè)試此測(cè)試版。我們今天可以測(cè)試的越多，我們就可以更快地進(jìn)行分類并找出任何可能出現(xiàn)的問(wèn)題！

非常感謝所有幫助我們制作wepback 4的貢獻(xiàn)者。正如我們總是說(shuō)的那樣，webpack的威力是我們的零件和生態(tài)系統(tǒng)的總和。

原文地址：https://medium.com/webpack/we...