我設法創建了一個生成用戶可以下載的文本檔案的函式。
當我運行 Gatsby 的開發版本時，它作業得很好，但是當我為生產而構建時，我得到了錯誤：WebpackError: ReferenceError: Blob is not defined
如果我然后嘗試從“緩沖區”添加 import {Blob}，我會得到：WebpackError: ReferenceError: window is not defined然后它也不再適用于 Gatsby 開發。
從我設法發現的是，我什至根本不應該將 Blob 與 Node 一起使用，而是使用 Buffer，但我完全迷失了，因為它似乎沒有直接替換 Blob。另外，為什么它適用于我的開發版本但不適用于生產？感覺我應該接近解決方案？
這是我的功能：
export function Download() {
const data = new Blob(["Hello world"], {
type: "text/plain;charset=utf-8",
});
const downloadLink = window.URL.createObjectURL(data);
return downloadLink;
}
export default Download;
uj5u.com熱心網友回復：
據我所知，我什至根本不應該將 Blob 與 Node 一起使用
這是部分正確的。當您說Blob根本不使用 Node 時，您是對的，但是，當您運行時gatsby build，您的代碼會被決議并捆綁在 Node 服務器中，這就是它破壞代碼的原因。換句話說，您的代碼由節點服務器解釋，其中沒有window或其他全域物件（例如document），因為它們甚至還沒有定義。另一方面，當您運行gatsby develop代碼時，瀏覽器會解釋您的代碼，其中存在window和其他全域物件。
您可以通過添加以下條件輕松繞過此問題：
if(typeof window !== "undefined")
這將檢查您是在服務器上還是在客戶端上。
嘗試使用：
export function Download() {
if(typeof window !== "undefined"){
const data = new Blob(["Hello world"], {
type: "text/plain;charset=utf-8",
});
const downloadLink = window.URL.createObjectURL(data);
return downloadLink;
}
}
export default Download;
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/432252.html
標籤：javascript 网页包 斑点 盖茨比