web pack

WebPack是模塊捆綁器,若是你的代碼跨越了不一樣模塊(例如不一樣Javascript文件),web pack能夠將這些零散的代碼構建到瀏覽器可讀單個文件中。前端

web pack還能夠做爲構建通道,你能夠在構建代碼以前對代碼進行轉換,例如使用Babel/Sass或TypeScript還可使用一系列插件來優化你的應用程序。web

不少開發人員以爲web pack難以掌握,配置起來也很麻煩,但若是沒有它,將沒法使用Vue的一些功能(如單個文件組件)。瀏覽器

最近發佈的VueCLI3提供了一種用於在Vue項目中抽象和自動配置web pack的解決方案。緩存

這是否意味着你不須要學習web pack了?固然不是,由於你仍然不可避免的須要進行定製或調試web pack配置。服務器

Vue 的框架

構建在 Vue 之上的框架讓你無需從頭開始實現服務器端渲染,還能夠建立本身的組件庫以及完成不少其餘常見任務。前端工程師

有不少很好的 Vue 框架,在這裏咱們只列出使用最爲普遍和最重要的三個框架。框架

Nuxt.js

若是你想要構建一個高性能的 Vue 應用程序,就須要基於組件的路由、服務器端渲染、代碼拆分和其餘尖端的功能。你還須要像 SEO 標籤這樣的功能。佈局

Nuxt.js 經過各類社區插件提供了這些開箱即用的功能,以及更多的功能選項,如 PWA。性能

Vuetify

谷歌的 Material Design 是一個使用十分普遍的指南,用於構建漂亮的邏輯用戶界面,並被用在谷歌的產品(如 Android 和 Web)當中。學習

Vuetify 在一系列 Vue 組件中實現了 Material Design。所以,你可使用 Material Design 佈局和樣式快速構建 Vue 應用程序,以及模態、警報、導航欄、分頁等小部件。

NativeScript-Vue

Vue.js 是一個用於構建 Web 用戶界面的庫。若是你想將它用於原生移動界面,可使用 NativeScript-Vue 框架。

NativeScript 是一個用於在 iOS 和 Android 上使用原生用戶界面組件構建應用程序的系統,而 NativeScript-Vue 是一個基於 NativeScript 的框架,提供了 Vue 的語法和組件的使用方式。

 其餘

插件開發

若是要在項目中重用 Vue 功能或爲 Vue 生態系統作貢獻,能夠將功能做爲 Vue 插件來開發。

動畫

若是你須要使用動畫,請了解一下 Vue 的過渡系統,它也是 Vue 核心的一部分。你能夠在向 DOM 添加元素或從 DOM 中刪除元素時應用動畫。

你須要建立 CSS 類來定義所需的動畫效果,不管是淡入淡出、更改顏色仍是你喜歡的其餘方式。當向 DOM 中添加元素或從 DOM 中刪除元素時,Vue 會檢測到這些變動,並在過渡期間添加或刪除相應的 CSS 類。

漸進式 Web 應用程序

漸進式 Web 應用程序(PWA)就像普通的 Web 應用程序同樣,只是加入了改進的用戶體驗。例如,PWA 可能包括脫機緩存、服務器端渲染、推送通知等。

大多數 PWA 功能能夠經過 Vue CLI 3 插件或使用 Nuxt.js 等框架添加到 Vue 應用程序中,但你仍然須要瞭解一些關鍵技術,包括 Web App Manifest 和 ServiceWorker。

-本身是從事了五年的前端工程師,很多人私下問我,2019年前端該怎麼學,方法有沒有?

沒錯,年初我花了一個多月的時間整理出來的學習資料,但願能幫助那些想學習前端,卻又不知道怎麼開始學習的朋友。

相關文章
相關標籤/搜索