自從我在login.js上嘗試了受保護的路由
<Router basepath="/">
<PrivateRoute path="/edit" />
</Router>
這在edit.js上
useEffect(() => {
// ... some code here
getEscritos();
if (!user && location.pathname !== `/login`) {
navigate("/login");
return null;
}
}, []);
我無法再構建它...錯誤是：
視窗未定義
雖然在本地運行良好。一切正常。
然后我在研究后在gatsby-node.js上嘗試了這個
exports.onCreateWebpackConfig = ({ stage, loaders,
actions, getConfig }) => {
if (stage === "build-html" || stage === "develop-html") {
actions.setWebpackConfig({
module: {
rules: [
{
test: /reach-router/,
use: loaders.null(),
},
],
},
});
externals: getConfig().externals.concat(function (
context,
request,
callback
) {
const regex = /^@?firebase(\/(. ))?/;
// exclude firebase products from being bundled, so
they will be loaded using require() at runtime.
if (regex.test(request)) {
return callback(null, "commonjs " request); // <-
use commonjs!
}
callback();
});
}
};
現在的錯誤是：
WebpackError: TypeError: isRedirect 不是函式
我不知道該怎么做...
這是repo，如果有幫助的話。
提前感謝您的寶貴時間。
uj5u.com熱心網友回復：
您需要將您的 Firebase 使用和初始化包裝在以下條件中：
if(typeof window !== 'undefined')
您在 SSR（服務器端渲染）中觸發了多個 Firebase 實體。
應用于您的escritos.js：
if(typeof window !== 'undefined'){
const db = getFirestore(app);
const escritosColRef = collection(db, "escritos");
}
這同樣適用于index.js（第 31 行）等等......
useEffect鉤子內的參考（帶有空deps, []）應該在沒有window條件的情況下作業，因為它們是在加載 DOM 樹時觸發的，因此不會破壞 SSR。如果錯誤仍然存??在，請嘗試包裝它們。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/411431.html
標籤：
上一篇：從Webpack包中排除模塊
下一篇：無法從庫的主檔案匯入特定匯出