前端周报第 19 期

2019-05-26 | 前端周报

# 精选

# JavaScript Proxy 实战指南

ES6 新引入了 Proxy 对象,它不仅能用在元编程上,还支持了 Vue3.0 新的响应式原理,但除此之外我们对 Proxy 的了解甚少。本文作者揭开 Proxy 的神秘面纱,用简单易懂的代码示例,介绍它的用法、优劣点和适用场景。

# 教程

# Webpack 是怎样运行的?(一)

Webpack 生成的文件,实现了类似 CommonJS 的模块加载机制,不同模块会被 __webpack_exports____webpack_require__ 关联起来实现模块化调用。

# Webpack 是怎样运行的?(二)

接着上一篇,Webpack 为了实现异步加载模块,动态插入模块脚本,在全局维护 window.webpackJsonp 数组管理异步模块。

# JavaScript 整洁之道 - 一些最佳实践

怎样的代码才是好的代码?作者从代码的整洁度,代码是否易于理解的角度提出了一些最佳实践。

code review

code review

# 深入 display:双值语法

为了更好的理解 display 的各个值的含义和区别,作者引出了 display 的双值语法,比如 display: flex; 实际上应该理解为 display: block flex;,说明该元素具有块级元素的特性,而 flex 会影响它子元素的排列布局。

# 深入 display:生成盒子

作者主要介绍了 display: none;display: contents;,两者的区别和特点。

# 工具&资源

# Water.css

一个可以直接应用在简单网页上的 css 库,引入后提供简洁美观的默认样式。

# AST Explorer

在线将代码(比如: JavaScript) 解析成 AST 的工具。

# await-timeout

基于 Promise 实现的定时器(setTimeout)。

# sync-dotenv

Node 应用可使用 .env 文件控制环境变量,这个工具可以帮你自动同步到 .env.example 文件。