Quasar CLI 搭配 Webpack - @quasar/app-webpack
警告
本指南適用於 Quasar v2.6+ 和 @quasar/app-webpack v3.4+
SSR 應用程式在伺服器和用戶端上執行相同的程式碼。在 .vue SFC 檔案中宣告 Vue 指令（或直接匯入）通常足以使其在非 SSR 建置中運作。但在 SSR 建置中，由於 Vue 3 的架構，它需要一些額外的工作。
伺服器端建置要求所有 Vue 指令也在其定義中指定 getSSRProps() 方法。
提示
- 您不需要為 Quasar 提供的 Vue 指令執行任何操作即可使其運作。
- 但是，如果您正在使用第三方提供的 Vue 指令，且 CLI 因此發生錯誤，則您需要聯絡該套件的擁有者，以便他們使其符合 Vue 3 SSR 規範（即在指令的定義中加入 getSSRProps() 方法）。
如何宣告指令
以下摘錄自Vue.js 文件
由於大多數自訂指令都涉及直接 DOM 操作，因此在 SSR 期間會被忽略。但是，如果您想指定應如何呈現自訂指令（即它應將哪些屬性新增至呈現的元素），則可以使用 getSSRProps 指令 Hook
const myDirective = {
mounted (el, binding) {
// client-side implementation:
// directly update the DOM
el.id = binding.value
},
getSSRProps (binding) {
// server-side implementation:
// return the props to be rendered.
// getSSRProps only receives the directive binding.
return {
id: binding.value
}
}
}content_paste