這回為了 Side Project 的開發 SEO 需要,來嘗試使用 Nuxt js 來架站並產生相關內容。這邊筆記下如何維持 Vuex 的狀態一致。
概念和注意事項
1. SSR 在 Server 端執行時,是沒辦法取得 window 的值。( 畢竟根本沒有 window 這個物件 )
2. Plugins 若在 Server 和 Client 端一起執行時,會執行兩遍 ( 先 Server 後 Client )
3. Nuxt.js 在 Server 端的 req,可以取得 headers.cookie 。
4. 將要持久化的值放到 cookie 中,就可以在 Server 和 Client 中都取得
程式碼
[ Github ]:https://github.com/andy922200/nuxt-vue2-typescript-template
此 Repo 會陸續更新進度
相關文章
★全文分享★ [筆記] Nuxt js 初探筆記 5 – Nuxt Generate 模式下跳轉到 Error Page
Nuxt js 之所以被採用作為前端框架的選項之一,很大一部分就是為了讓搜尋引擎的爬蟲能夠認得網頁。這邊筆記下當你使用 Nuxt Generate 模式生成靜態網頁時,那要如何跳轉到共同的 Error Page 模板上。
★全文分享★ [筆記] Nuxt js 初探筆記 4 – SEO 相關的逐頁設定
Nuxt js 之所以被採用作為前端框架的選項之一,很大一部分就是為了讓搜尋引擎的爬蟲能夠認得網頁。這邊筆記下一些與 SEO 相關的設定項目,會從多頁共用的 global 設定到單一頁面的設定來提供處
★全文分享★ [筆記] Nuxt js 初探筆記 3 – 佈署靜態頁面的測試問題
當運用 Nuxt 開發若要產生靜態頁面,其概念類似於快照 ( snapshot ) 一份當下與 server-side 的互動結果。這個網頁被靜態託管的站點 ( 如 Netlify、Amazon S3 … 等 ) 讀取時,跟 SPA 網站相比,其 header 和運用
★全文分享★ [筆記] Nuxt js 初探筆記 1 – 基礎環境建置
這回為了 Side Project 的開發 SEO 需要,來嘗試使用 Nuxt js 來架站並產生相關內容。這邊筆記下架設基礎環境前和過程中要留心的概念和內容。概念和注意事項1. 使用 npx 安裝時,若有出現 error cb.apply i
Reference
1. Persisting state with Server Side Rendering
2. vuex-persistedstate