今天在掘金上突然看到京东凹凸实验室发布的一篇《向强大的svg迈进》，想到前几个月项目老大非得让我从svg图标换成iconfont字体图标，最后在我耐心给老大讲了svg的未来，对比了iconfont与普通png的区别后，老大妥协了，让我说服其他成员，代码保持一致就行，:( ，没办法，又得给其他同事讲下。所以今天为了科普svg，写来这篇

SVG 即 Scalable Vector Graphics 可缩放矢量图形，使用XML格式定义图形。
原文地址

SVG 的应用十分广泛，得益于 SVG 强大的各...

原文地址

首先，我们要搞清楚浏览器缓存是怎么工作的。 那么，就让我画一张图来告诉大家吧，嘻嘻。

• 浏览器: 我需要 foo.js
• 服务器: 让我找找。找到了，给你，缓存有效期为 1 年。
• 浏览器: 好，我把他缓存到磁盘里。

过了 2 天，

浏览器: 我需要 foo.js ，在缓存里找到了。缓存还有效，那直接读缓存。
用户：哇塞，这网页秒开啊。

又过了 2 天，foo.js 的代码更新了。（内容从 Hello world 变成了 Goodbye world ）

浏览器：我需要 foo.js ...

Webpack 通过 Plugin 机制让其更加灵活，以适应各种应用场景。 在 Webpack 运行的生命周期中会广播出许多事件，Plugin 可以监听这些事件，在合适的时机通过 Webpack 提供的 API 改变输出结果。

一个最基础的 Plugin 的代码是这样的：

class BasicPlugin{
  // 在构造函数中获取用户给该插件传入的配置
  construcor(options){

  }
  apply(compiler){
    // Webpack ...

Loader 就像是一个翻译员，能把源文件经过转化后输出新的结果，并且一个文件还可以链式的经过多个翻译员翻译。

以处理 SCSS 文件为例：

SCSS 源代码会先交给 sass-loader 把 SCSS 转换成 CSS；
把 sass-loader 输出的 CSS 交给 css-loader 处理，找出 CSS 中依赖的资源、压缩 CSS 等；
把 css-loader 输出的 CSS 交给 style-loader 处理，转换成通过脚本加载的 JavaScript 代码；

module.exports...