Vue.js項目模板有哪些

這篇文章給大家分享的是有關Vue.js項目模板有哪些的內(nèi)容。小編覺得挺實用的，因此分享給大家做個參考。一起跟隨小編過來看看吧。

十多年的大冶網(wǎng)站建設經(jīng)驗，針對設計、前端、開發(fā)、售后、文案、推廣等六對一服務，響應快，48小時及時工作處理。成都全網(wǎng)營銷的優(yōu)勢是能夠根據(jù)用戶設備顯示端的尺寸不同，自動調(diào)整大冶建站的顯示方式，使網(wǎng)站能夠適用不同顯示終端，在瀏覽器中調(diào)整網(wǎng)站的寬度，無論在任何一種瀏覽器上瀏覽網(wǎng)站，都能展現(xiàn)優(yōu)雅布局與設計，從而大程度地提升瀏覽體驗。成都創(chuàng)新互聯(lián)公司從事“大冶網(wǎng)站設計”,“大冶網(wǎng)站推廣”以來，每個客戶項目都認真落實執(zhí)行。

你要開始一個重要的Vue項目嗎?為了確保您從一個堅實的基礎開始，您可以使用一個模板(也稱為樣板、骨架、啟動器或腳手架)，而不是從npm init或vue init開始。

許多經(jīng)驗豐富的開發(fā)人員都以開源模板的形式收集了關于構建高質量Vue應用程序的經(jīng)驗。這些模板包括最佳配置和項目結構、最佳第三方工具和其他開發(fā)最佳實踐。

與為靈活性進行優(yōu)化的Vue CLI 3不同，模板是自定義的。因此，選擇一個適合您的開發(fā)理念，并且具有與您需要的開箱即用的特性大致相同的特性是很重要的。

選擇Vue模板的一些考慮事項包括:

• Webpack

• PWA

• Full-stack with authentication

• Good documentation

• GraphQL

• Testing

等等。

現(xiàn)在有很多great Vue.js模板，但是在本文中，我們將介紹5個包含新項目經(jīng)常需要的關鍵特性的模板。

1. 最適合Webpack

如果您需要一個可靠的Webpack設置，那么只需查看Vue CLI 2中包含的Webpack模板即可。GitHub上有近7000顆星星，Vue團隊成員負責開發(fā)和維護，這個模板是您創(chuàng)建高度優(yōu)化的webpack支持的SPA的最佳選擇。

這個模板利用了Webpack及其生態(tài)系統(tǒng)的許多前沿特性，包括熱重載、CSS提取、linting，當然還有單文件組件加載。它還包括為開發(fā)、生產(chǎn)甚至測試優(yōu)化的單獨配置。

作為Vue CLI 2的一部分，這是我們將提供的最不固執(zhí)己見的模板之一，因此不包含許多需要的額外功能，比如服務器端呈現(xiàn)。

如果你發(fā)現(xiàn)Webpack模板有點過分，你可以試試它的小兄弟，Webpack Simple模板。

鏈接: https://github.com/vuejs-templates/webpack

注意:即將離開beta版的Vue CLI version 3已經(jīng)放棄了模板體系結構，轉而支持插件，因此這個模板在技術上是不受歡迎的，但是仍然可以從Vue CLI 3的遺留設置中使用。在我們的文章Vue CLI 3中了解更多:前端開發(fā)的游戲規(guī)則改變者。

2.最適合的PWA

你需要先進應用程序的高級用戶體驗嗎?Vue Starter是一個用于服務器呈現(xiàn)的PWAs的SPA模板。它包括Vuex和Vue路由器，配置為使用服務器端呈現(xiàn)(SSR)開箱即用。

這個項目在確保您部署的項目從一開始就具有出色的UX方面投入了大量的精力，比如支持多種語言的國際化和Lighthouse評分90+，這要歸功于SSR和service worker緩存。

此外，使用vue-meta管理文檔頭部標簽用于SEO，而SSR確保您的頁面將被支持JavaScript內(nèi)容的搜索引擎索引。

鏈接：https：//github.com/devCrossNet/vue-starter

演示：https：//vue-starter.herokuapp.com

如果你正在建造一個PWA，另一個不錯的選擇是VuePack，當然，還有Vue CLI 2 PWA templat

3.最適合身份驗證

如果您需要用戶身份驗證，請查看Vue Express Mongo樣本文件。該項目提供了一個完整的堆棧“MEVN”web應用程序的樣板，具有開箱即用的身份驗證，包括用戶注冊和谷歌、Facebook、Twitter和GitHub的社交登錄。

此模板遵循安全最佳實踐，使用OAuth 2，Helmet（添加安全HTTP標頭）和Express Validator進行輸入清理。它還為多個遠程日志記錄服務提供支持。

對于數(shù)據(jù)庫，提供了帶有Mongoose的MongoDB。repo還包含Docker配置，因此您可以輕松地啟動一個實例。

鏈接：https：//github.com/icebob/vue-express-mongo-boilerplate

演示：http：//vemapp.moleculer.services/

提示：如果您更喜歡使用Laravel作為經(jīng)過身份驗證的Vue應用程序的后端，請嘗試使用包含許多類似功能的Laravel Vue Boilerplate。

4.最適合文檔

許多模板失敗的原因是缺乏文檔。Vue Enterprise Boilerplate不是這樣。該項目由Chris Fritz創(chuàng)建和維護，他編寫了大部分Vue文檔，因此它組織良好并與Vue最佳實踐保持一致。

這個模板的文檔最棒的地方在于，它不僅解釋了包含了什么，而且通常還解釋了不包含什么，以及為什么不包含。例如，Chris解釋了為什么沒有TypeScript、Babel polyfill、Pug等模板中常見的模板。

不要讓這個應用程序的簡潔默認頁面欺騙你，它也有很多功能。我最喜歡的一些包括用于測試的模擬API，以及包含生成器，允許您自動添加單元測試來設置組件，視圖和布局。

Vue Enterprise Boilerplate還支持Vue CLI 3，因此可以使用其他Vue CLI 3插件輕松擴展項目。

鏈接：https：//github.com/chrisvfritz/vue-enterprise-boilerplate

5. 最適合GraphQL

GraphQL現(xiàn)在風靡一時，許多開發(fā)人員都希望在他們的新Vue項目中使用它。雖然沒有多少Vue模板，但如果您需要GraphQL，請務必查看Vuexpresso。

這個項目使用GraphQL、Apollo和GraphiQL UI，這是一個用于研究GraphQL的瀏覽器內(nèi)IDE。此外，您還可以獲得一個配置良好的Webpack設置、Vuex和Vue路由器。您還可以獲得Storybook，它允許交互式開發(fā)、測試和共享UI組件。

Vuexpresso唯一的缺點是它仍然相當新，所以一定要有時間徹底測試你用它構建的任何應用程序。

鏈接：https：//github.com/Ethaan/vuexpresso

支持GraphQL的另一個樣板是Friendly Vue Starter，它還包括通過Critical提取的關鍵路徑CSS。

感謝各位的閱讀！關于Vue.js項目模板有哪些就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！

新聞標題：Vue.js項目模板有哪些
地址分享：http://www.muchs.cn/article2/ihejoc.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站改版、靜態(tài)網(wǎng)站、外貿(mào)建站、網(wǎng)站內(nèi)鏈、企業(yè)建站、網(wǎng)站建設

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)