サーバーサイドレンダリング (SSR)

参考:

Vue.js サーバサイドレンダリングガイド [公式]

ドキュメント

参考:

基本的な使い方 | Vue SSR ガイド [公式]

使い方

参考:

Vue.js で SSR (サーバサイドレンダリング) する – Qiita

すごくカンタンな SSR with Vue.js – Qiita

基本的な使い方 | Vue SSR ガイド [公式]

概要

参考:

Vue.js 2.0 で自社プロダクトを SPA + SSR 化した話 – SlideShare

Renderer

参考:

Renderer | Vue SSR ガイド [公式]

createRenderer | Vue SSR ガイド [公式]

BundleRenderer

参考:

BundleRenderer | Vue SSR ガイド [公式]

createBundleRenderer | Vue SSR ガイド [公式]

template

参考:

template | Vue SSR ガイド [公式]

データストア

参考:

データのプリフェッチと状態 | Vue SSR ガイド [公式]

Data pre-fetching about sub components · Issue #29 · vuejs/vue-ssr-docs – GitHub

getMatchedComponents

参考:

router.getMatchedComponents | Vue Router [公式]

Component in Vue.js server-side rendering – Stack Overflow

キャッシュ

参考:

キャッシュ | Vue SSR ガイド [公式]

タイトル

参考:

ヘッドの管理 | Vue SSR ガイド [公式]

Nuxt.js

参考:

Vue.js + SSR を利用した Web サイトコーディングの可能性 | オンスタ

render function or template not defined in component エラー

SSR で描画しようとした際に render 関数もしくはテンプレートが見つからない旨のエラーが発生する。

Error: render function or template not defined in component

対処法

該当するコンポーネントを SSR で描画しないようにする。<no-ssr></no-ssr> タグで囲う。(no-ssr コンポーネントを使う。)

参考:

dfeinberg5 commented on 25 Dec 2017 – SSR compatibility · Issue #114 · NightCatSama/vue-slider-component – GitHub

render function or template not defined in component: anonymous · Issue #1041 · nuxt/nuxt.js – GitHub

Errors become “render function or template not defined in component: anonymous” after refresh · Issue #2792 · nuxt/nuxt.js – GitHub

render function or template not defined in component: anonymous – Stack Overflow

Tips

参考:

スタートアップで SSR に Vue.js を導入して Web サービスを開発して得た設計 – Qiita

no-ssr

参考:

Hide SSR-Incapable Vue Components with vue-no-ssr | Alligator.io

<no-ssr> コンポーネント | Nuxt.js [公式]

egoist/vue-no-ssr: Vue component to wrap non SSR friendly components – GitHub

vue-ssr-example

参考:

TatsuUkraine/vue-ssr-example: Ready for use Example for Vue + Vuex + TS + SSR + Jest – GitHub

vue-mq

参考:

AlexandreBonaventure/vue-mq: Define your breakpoints and build responsive design semantically and declaratively in a mobile-first way with Vue. – GitHub

SSR Support · Issue #2 · AlexandreBonaventure/vue-mq – GitHub

nuxt-mq

参考:

vanhoofmaarten/nuxt-mq: vue-mq module for Nuxt.js – GitHub

nuxt.js (v2) で便利な vue-mq を使ってみるが SSR モードでコンソールエラーがでるので確認してみた。 – Qiita

記事をシェアする:
タグ:

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Protected by reCAPTCHA