成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

初識vue ssr(nuxt.js) ---- 持續(xù)更新

G9YH / 3133人閱讀

摘要：安裝創(chuàng)建模板項(xiàng)目安裝依賴項(xiàng)編譯并啟動(dòng)服務(wù)打開目錄結(jié)構(gòu)需要編譯的資源文件，如等?？捎米魈砑訉?dǎo)航欄底部欄等截面。用于存放頁面級別的組件。插件狀態(tài)管理器目錄，如果該目錄是空的，將不啟用。

安裝 
// vue-cli 創(chuàng)建nuxt模板項(xiàng)目
$ vue init nuxt-community/starter-template 
// 安裝依賴項(xiàng)
$ cd 
$ npm install
// 編譯并啟動(dòng)服務(wù)
$ npm run dev
// 打開 http://localhost:3000
目錄結(jié)構(gòu)

assets 需要編譯的資源文件，如 JavaScript、SASS、LESS 等。

static 不需要編譯的靜態(tài)資源文件，如圖片資源。

components 顧名思義，存放 *.vue 組件的地方。一般用來存放非頁面級別的組件，如 header、footer 等公共組件，該目錄下的組件具有常規(guī) vue 組件的方法和特性，不會被 nuxt.js 擴(kuò)展特性

layouts 布局目錄，設(shè)置布局的地方，其中 標(biāo)簽是我們寫的頁面內(nèi)容。可用作添加導(dǎo)航欄、底部欄等截面。

middleware 中間件目錄，所謂中間件，就是在頁面與頁面跳轉(zhuǎn)中執(zhí)行的函數(shù)方法。如頁面跳轉(zhuǎn)時(shí)驗(yàn)證用戶信息操作。

pages 用于存放頁面級別的組件。該目錄下的文件會轉(zhuǎn)換成相應(yīng)的路由路徑供瀏覽器訪問。另外呢，該目錄下的 *.vue 頁面文件中 Nuxt.js 提供了一些特殊的方法用于處理服務(wù)器渲染中的事件。page路由、頁面

plugins 插件目錄，像 mint-ui 這種第三方插件就放在這里。插件

store vuex 狀態(tài)管理器目錄，如果該目錄是空的， Nuxt.js 將不啟用 vuex。當(dāng)我們在該文件夾下創(chuàng)建 index.js 文件后即可使用 vuex 狀態(tài)管理器

nuxt.config.js 該文件是 Nuxt.js 的唯一配置項(xiàng)，之前提過 Nuxt.js 將 Webpack 等一眾配置都封裝好了，所以如果需要特殊配置，只需要修改該文件來覆蓋默認(rèn)配置即可 API

注意

header和footer放在layout目錄下的default里面

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/103364.html

相關(guān)文章

  • 服務(wù)端預(yù)渲染之Nuxt（介紹篇）

    摘要：為了解決問題，推出了服務(wù)端預(yù)渲染，以便提高對優(yōu)化。應(yīng)用，到了，單頁面應(yīng)用優(yōu)秀的用戶體驗(yàn)，逐漸成為了主流，頁面整體式渲染出來的，稱之為客戶端渲染。客戶端接收數(shù)據(jù)，然后完成最終渲染。通過對客戶端服務(wù)端基礎(chǔ)框架的抽象組織，主要關(guān)注的是應(yīng)用的渲染。 現(xiàn)在前端開發(fā)一般都是前后端分離，mvvm和mvc的開發(fā)框架，如Angular、React和Vue等，雖然寫框架能夠使我們快速的完成開發(fā)，但是由于前...

    Shonim 評論0 收藏0

  • vue-meta讓你更優(yōu)雅的管理頭部標(biāo)簽

    摘要：在應(yīng)用中，如果想要修改的頭部標(biāo)簽，或許，你會在代碼里，直接這么做改下引入一段修改信息，或者給標(biāo)簽添加屬性此處省略一大坨代碼今天給大家介紹一種更優(yōu)雅的方式，去管理頭部標(biāo)簽介紹借用上的介紹，基于的插件，主要用于管理頭部標(biāo)簽，同時(shí)也支持。 在 Vue SPA 應(yīng)用中，如果想要修改HTML的頭部標(biāo)簽，或許，你會在代碼里，直接這么做: // 改下title document.title = wh...

    leone 評論0 收藏0

  • Nuxt.js 基礎(chǔ)入門教程

    摘要：原文鏈接開發(fā)一個(gè)單頁面應(yīng)用，相信很多前端工程師都已經(jīng)學(xué)會了，但是單頁面應(yīng)用有一個(gè)致命的缺點(diǎn)，就是極不友好?；谒?，我們可以快速開發(fā)一個(gè)基于的單頁面應(yīng)用。只有數(shù)據(jù)流存在相關(guān)配置時(shí)可用。引入后，所有頁面均有效。 原文鏈接 Vue 開發(fā)一個(gè)單頁面應(yīng)用，相信很多前端工程師都已經(jīng)學(xué)會了，但是單頁面應(yīng)用有一個(gè)致命的缺點(diǎn)，就是 SEO 極不友好。除非，vue 能在服務(wù)端渲染（ssr）并直接返回已經(jīng)渲...

    yedf 評論0 收藏0

  • vue 服務(wù)器端渲染 nuxt.js初探

    摘要：在調(diào)研插件后，發(fā)現(xiàn)無法滿足以及等要求時(shí)，果斷選用了做服務(wù)器渲染。布局目錄該目錄名為保留的，不可更改。服務(wù)器啟動(dòng)的時(shí)候，該目錄下的文件會映射至應(yīng)用的根路徑下。它可以在服務(wù)端或路由更新之前被調(diào)用?？捎糜谥付ǚ?wù)端返回的請求狀態(tài)碼。 開頭還是來一段廢話： 年關(guān)將近，給大家拜個(gè)早年，愿大家年會都能抽大獎(jiǎng)，來年行大運(yùn)。 廢話不多說，直接進(jìn)正文 項(xiàng)目環(huán)境： 前端vue項(xiàng)目， 需要將新增的幾個(gè)路由頁...

    bingchen 評論0 收藏0

發(fā)表評論

0條評論

最新活動(dòng)
閱讀需要支付1元查看
<