已解決430363個問題，去搜搜看，總會有你想問的

如何將 Vue 組件構建為支持 SSR 的 Nuxtjs 庫？

首頁猿問如何將 Vue 組件構建為支持...

如何將 Vue 組件構建為支持 SSR 的 Nuxtjs 庫？

JavaScript

繁星coding 2023-03-18 16:46:00

我在 monorepo 環境中有兩個包，一個 nuxtj 的應用程序。一個 Vue 2 組件庫。我正在嘗試將組件包構建為“庫”，以便我可以在 Nuxt 應用程序中導入組件。構建-安裝-導入庫后，nuxt 引發以下錯誤：document is not defined在庫構建中function o(e) { var t, n, i = document.querySelector('style[data-vue-ssr-id~="' + e.id + '"]'); if (i) { if (f) return g; i.parentNode.removeChild(i) } if (m) { document我知道這是因為 nuxt在嘗試在服務器端呈現頁面時遇到了瀏覽器的對象。想一想，是不是因為我使用了組件內樣式？如果有人可以確認它會很棒嗎？

查看完整描述

1 回答

慕碼人8056858

TA貢獻1803條經驗獲得超6個贊

如果你想創建一個完整的 Vue SSR 庫，你可以遵循這個非常有用的指南。

否則你可以通過這種方式告訴 Nuxt 只在客戶端加載你的庫：

在您的 Nuxt 應用程序中創建文件plugins/my-vue-library-plugin.js

用這個內容填充它以導入你的 Vue 組件庫：

import Vue from 'vue'

import MyLibrary from 'my-vue-library-path'

Vue.use(MyLibrary)

plugins然后在我們的密鑰中添加文件路徑nuxt.config.js

export default {

plugins: [

{ src: '~/plugins/my-vue-library-plugin.js', mode: 'client' }

]

}

如何查看該mode: 'client'屬性是關鍵，因為它告訴 Nuxt 僅在客戶端加載庫，因此您的document is not defined錯誤應該會消失。

讓我知道是否有幫助。

反對回復 2023-03-18

1 回答
0 關注
160 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何將 Vue 組件構建為支持 SSR 的 Nuxtjs 庫？

如何將 Vue 組件構建為支持 SSR 的 Nuxtjs 庫？

1 回答

添加回答

如何將 Vue 組件構建為支持 SSR 的 Nuxtjs 庫？

如何將 Vue 組件構建為支持 SSR 的 Nuxtjs 庫？