前端日刊-2017.11.25

每天努力的日刊君 - 2017.11.25

EveryDay為小夥伴們推薦 3 篇有質量的前端技術文章，讓你每一天都收穫滿滿還在等什麼，和日刊君一起把~

The Next Day is Always a New Day

Vue.js

在 Vue.js 中使用 Mixin

又是一篇 css-tricks 的文章，正好 zcfy 上面的也有一篇翻譯

估計有同學會和 react mixins (以及後面的高階組件) 對比，後續我們也會有專門的文章分析給大家

mixins 簡單地說就是可以復用，文中也有一個 paulpflug 的 vue-mixins 的 ts 例子

mixin 可以是一個對象，包含生命周期的方法，如果和組件的生命周期重名了，優先會註冊 mixin 上的

當然也有同樣的生命周期調用 methods 以及一些全局 mixin 的情況

鏈接：

http://zcfy.cc/article/using-mixins-in-vue-js-css-tricks-3257.html https://css-tricks.com/using-mixins-vue-js/

Vue.js

Vuejs 2.0 源碼解析之渲染篇

來自騰訊前端的一篇文章

圖文並茂，喜歡源碼學習的同學可以看看，裡面也提到了：

render 函數執行生成 VNode 對象

通過 patch 方法，對比新舊 VNode 對象，通過 DOM Diff 演算法，添加、修改、刪除真正的DOM元素

鏈接：

https://mp.weixin.qq.com/s/-ykt8u1N50vRnFp2A_4m8Q

Webpack

玩轉 webpack（一）：webpack的基本架構和構建流程

對於一個每天你都在使用的模塊打包工具，你熟悉它嗎？

作者基於 3.6.0 版本，裡面介紹了 webpack 的構建流程，最早其實有一個 alicdn 的流程圖，可以對比一下，一般分為 3 個階段：

webpack 準備階段

modules 和 chunks 的生成階段

文件生成階段

鏈接：

https://mp.weixin.qq.com/s/5Ke5EE1UnnAbj1CPrQH7SQ

歡迎關注我們的微信公眾號：前端新視野