作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我将我的第一个 Gatsby 项目部署到 github 页面:
repo :https://github.com/michal-kurz/stfuandclick
gh-页面:https://michal-kurz.github.io/stfuandclick/app/ (从 gh-pages
分支生成)
它只有一页,src/pages/app.tsx
, 使用 Reach Router用于动态路由。
// app.tsx
const App = () => (
<>
<GlobalStyles />
<Provider store={store}>
<ThemeProvider theme={theme}>
<Router>
<Homepage path={`${BASE_URL}/app/`} />
<Team path={`${BASE_URL}/app/team/:teamName/`} />
</Router>
</ThemeProvider>
</Provider>
</>
)
// gatsby-node.js
exports.onCreatePage = async ({ page, actions }) => {
const { createPage } = actions
if (page.path.match(/^\/app/)) {
page.matchPath = '/app/*'
createPage(page)
}
}
备注 :
BASE_URL
等于
/stfuandclick
在生产环境版本和
''
在其他环境中
gatsby develop
)下一切正常,但在部署版本上,无法访问
/team/:teamName
不使用
/app/
作为应用程序的入口点(转到
/app/
并单击蓝色按钮工作正常)。
/app/
,但随后 ctrl + f5 再次导致 404)。
gatsby.node.js
部署应用程序后无法正常工作。我最初怀疑它根本不起作用,但显然事实并非如此,因为注释所有代码会进一步破坏应用程序(团队页面在通过来自
/app
的链接访问时突然收支平衡)。
gatsby-node.js
中添加路径前缀与
BASE_URL
在生产构建中,如下所示:
exports.onCreatePage = async ({ page, actions }) => {
const { createPage } = actions
if (page.path.match(/^\/stfuandclick\/app/)) {
page.matchPath = '/stfuandclick/app/*'
createPage(page)
}
}
并在
gatsby-node.js
中为两条路径中的每一条添加前缀个人,但没有运气。
pathPrefix
在我的
gatsby-config.json
: (
full config here )
module.exports = {
pathPrefix: '/stfuandclick',
// ...
}
我使用以下 yarn 脚本进行部署:(
full package.json here )
"deploy": "gatsby build --prefix-paths && gh-pages -d public"
我该怎么做才能使我的路由正常工作?
最佳答案
我在处理 vickywords 时遇到了类似的问题.我在 Vercel 上托管了我的网站。基本上,服务器试图通过路径 dynamic-route/param/
来定位文档。并且它不知道动态路由。所以它抛出了 404 错误。
为了解决这个问题,我必须在我的源代码中进行 2 处更改。
const browser = typeof window !== "undefined" && window;
return browser && <NotFoundPage />;
{ "rewrites": [{ "source": "/word-finder/(.*)", "destination": "/word-finder" }] }
我注意到一个问题,
word-finder page 是我的动态路由的根页面,带有一些文本。当用户搜索某些内容时,我只需使用将呈现动态内容的参数重定向到同一页面。在看到实际内容之前,我看到了带有文本的根页面闪烁。
_redirect
中添加相同的行为。文件。确保将其放入
static
文件夹,以便在部署后将其复制。
关于deployment - Gatsby 动态路由在 gh-pages 部署时中断,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64412745/
安装并修复我的 VS2015 实例后,我仍然无法让智能感知(服务器端)在我的 MVC View 中工作。当我在 session 中第一次打开 .cshtml 文件并找到 Activitylog 文件时
我是一名优秀的程序员,十分优秀!