MDH 前端周刊第 14 期：Babel 7.15 const enum、Parcel 2 RC、webpack buildHttp - 《MDH 前端周刊》

这是「MDH：前端周刊」第 0014 期，发表于：2021/08/09。本期刊开源（GitHub: sorrycc/weekly），欢迎 issue 区投稿，推荐或自荐项目。

MDH 前端周刊第 14 期：Babel 7.15 const enum、Parcel 2 RC、webpack buildHttp - 图1

封面图：vorosbenisop @ www.unsplash.com 。

❄️ TL;DR

👉 Babel 7.15
👉 Parcel 2 RC
👉 Vite 2.5.0-beta.0
👉 pnpm v7 WIP
👉 webpack 5.49 支持 buildHttp
👉 优秀前端的工具修养
👉 手写 Vue

包含，

// Input
"World"
  |> `Hello, ${#}!`
  |> alert(#);
// output
var _ref, _ref2;
_ref2 = (_ref = "World", `Hello, ${_ref}!`), alert(_ref2);

和 deno 有点像，多了一种消费 http import 的选择。node 侧目前还不能运行时消费 http import，打包时消费看来是唯一的选择；browser 侧打包 http import 也能让 build 产物更稳定可控，同时减少 http 请求数，消灭串行请求问题。

默认不打包 http(s) import
配置 experiments.buildHttp 会打包，并生成 webpack.lock 和 webpack.lock.data 缓存文件，后者缓存的是文件内容
dev 阶段远程文件有变更时会更新 lock 文件，配置 experiments.buildHttp.upgrade: false 禁用更新
prod 阶段直接使用 lock 文件且不更新和不发 http 请求，除非设置了 Cache-Control: no-cache 缓存头
通过 experiments.buildHttp.cacheLocation: false 可禁用 webpack.lock.data 缓存
webpack cache 在这里的作用是缓存请求响应

类比 deno，

$ DENO_DIR=./webpack.lock.data
$ development: deno --lock=webpack.lock --lock-write --reload
$ production: deno --lock=webpack.lock --cached-only

工欲善其事必先利其器。

源码也是同理，我们按照电磁轨道炮的思路一步步来，先搞清楚最核心的基础部分，慢慢的再一步步去进阶。这样的学习方法比我们肯定一上来就去拆解一个完整版的电磁轨道炮要强得多。

本周刊每周一发布，同步更新在语雀 「mdh/weekly」 和微信公众号。
微信搜索 「云谦」 或者扫描二维码，即可订阅。

MDH 前端周刊第 14 期：Babel 7.15 const enum、Parcel 2 RC、webpack buildHttp - 图2

（完）