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

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

GatsbyJS 不正確地呈現 URL

GatsbyJS 不正確地呈現 URL

Helenr 2022-07-21 21:19:10
我在“pages”文件夾中有我的頁面,用這樣的小寫名稱調用:pages├── 404.js├── faq.js├── addresses.js├── service│   ├── service1.js│   └── service2.js└── services.jsGatsby 應該為他們提供與此小寫名稱相關聯的 URL(例如 /services 用于 pages/services.js),并且它在開發模式下工作,但在部署模式下(使用 netlify)它不會呈現頁面并且在重新加載時會將 URL 更改為以大寫字母開頭(如 /Services),然后加載。最奇怪的是,有些頁面可以正常工作(例如 /faq,它是 services.js 的完全副本,只更改了函數名稱),而其他頁面則不能。services.js 的代碼:import React from "react"...function Services() {  return (...)}export default Services和faq.js的代碼:import React from "react"...function Faq() {  return (...)}export default Faq所有 ... 在兩個文件中都相同。所有頁面都通過 Gatsby Links 鏈接:import { Link } from "gatsby"看起來像這樣:...<div className="footer-column">    <div className="footer-header">For clients</div>    <Link to="/services/" className="footer-item"> // Problem one      Our services    </Link>    <Link to="/faq/" className="footer-item"> // Working fine      Frequently asked questions    </Link></div>...以前我創建文件夾“服務”,然后將其重命名為“服務”,也許這里出現問題?但同時鏈接到 /addresses 也不起作用,并且從來沒有一個名為“addresses”的文件夾。我嘗試在元數據中設置 siteUrl,但沒有幫助。我該如何解決這個問題?
查看完整描述

3 回答

?
守著星空守著你

TA貢獻1799條經驗 獲得超8個贊

在沒有看到任何實際代碼的情況下,鏈接到 Gatsby 中頁面的最簡單方法(在我看來)是:


import Link from 'gatsby-link'


接著:


<Link to="/the-path-you-want-to-link-to">

  your link text

</Link>

只要您在文件中siteUrl配置了一個gatsby-config.js,您的鏈接路徑就會附加到它并且鏈接應該可以工作。<a>您也可以隨時使用標簽對它們進行硬編碼。


siteUrl鑰匙siteMetadata進去_gatsby-config.js


module.exports = {

  siteMetadata: {

    title: `Gatsby Default Starter`,

    description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`,

    author: `@gatsbyjs`,

    siteUrl: `https://your-production-url.com`


  },

  ...

}


查看完整回答
反對 回復 2022-07-21
?
慕斯王

TA貢獻1864條經驗 獲得超2個贊

由于某種原因,在我的計算機上以小寫字母命名的文件(顯示方式相同)在 git 中以大寫字母開頭。因此,如果你也得到了它,請檢查 GitHub 或你使用的任何其他 git 平臺中的文件名。

查看完整回答
反對 回復 2022-07-21
?
墨色風雨

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

更新的解決方案:在閱讀了 GitHub 在更新文件大小寫更改方面存在一些問題(如果文件最初以 Services.js 推送到 GitHub 后更改為 services.js),他們建議刪除該文件并使用相同的內容和名稱,但使用您喜歡的文件名大小寫。這對我有用。

老評論:

我有一個類似的問題。您可以在一個實時示例中看到這個問題:pearsondigitalmarketing.com通過單擊菜單然后查看“服務”和“視覺”如何加載。

該站點與 OP 相似,但使用 Gatsby Wordpress Experimental 主題構建。

我正在通過鏈接組件使用 Chakra UI 和 Gatsby Link 的組合,并且服務和視覺頁面都在本地構建(Gatsby Develop)中工作,但是由于我的生產構建是使用我的 GitHub 存儲庫在 Netlify 上構建的,所以它找到了一個大寫的頁面視覺和服務的版本。

這以某種方式為頁面最初加載造成了問題。

該頁面加載一個空白的白色屏幕。

如果我刷新該空白頁面,則在將非大寫路由重新路由到大寫路由之后,頁面會按預期加載(GitHub 和 Netlify 認為是正確的)

@dankondr 也提到了這一點。

有沒有人找到解決方案?我想我需要弄清楚為什么 GitHub 在推送時將這兩個頁面大寫。或者我只需要從本地文件部署到 Netlify/host,而不是使用 GitHub


查看完整回答
反對 回復 2022-07-21
  • 3 回答
  • 0 關注
  • 113 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號