nuxt開發-前言

以前公司的項目前身是jq先後端不分離的商城項目，使用響應式去適配移動端和pc端。隨着業務的發展。一套代碼維護起來至關麻煩，因此考慮seo的狀況下，咱們技術棧以nuxt+koa+elemenUI配合去重構這個項目。加上最近本身在學習Vue全家桶+SSR+Koa2開發的一個項目，恰好能夠把這個過程當中遇到的坑和學習到的知識點做爲一個系列記錄下來。

1、nuxt安裝基礎項配置

# npx create-nuxt-app nuxt-learn 提示中咱們只需根據提示安裝咱們所須要的內容便可
# npm install sass-loader node-sass 安裝sacc

2、nuxt工做流

3、nuxt路由

用法上和vue-router大體同樣，區別是nuxt路由建立即配置。好比建立了一個review頁面，它會自動給咱們加上路由，讓review的路由配置review的文件，作了映射。會把review文件做爲你配置的一個入口文件。

4、ssr是什麼?

1. ssr主要是爲了解決SEO問題
2. 解決內容快速展現效果

5、 ssr實現的原理？爲何把模版和數據同時給咱們？

1. 首先靜態內容沒有交互，交互在瀏覽器端完成，其實它有一個入口文件也會進行編譯，但不會直接渲染頁面，由於頁面在服務端扔過來的時候已通過一次渲染了。nuxt作的是將建立的虛擬編譯結果和扔給咱們的數據作對比。若是有區別，它會從新請求數據。編譯結果，也能夠理解虛擬Dom，編譯須要數據，編譯結果是什麼？須要什麼東西。第一個是模版，項目是一套模版，一套代碼。這種同構致使，瀏覽器端編譯虛擬Dom,也依賴vue文件，因此須要額外數據，他是在服務器端渲染以前請求數據，若是數據不一樣步到瀏覽器端。編譯結果必然不一樣。

這裏以美團網舉例，nuxt給到咱們的數據是經過建立一個script標籤。而後在window上掛載一個屬性對象，將返回的結果賦值給它