部署到 github 页面时，Gatsby 平滑滚动锚链接不起作用

Question

我有一个由几个页面组成的 Gatsby 网站。在导航栏上，有不同的链接。一些链接指向不同的页面，而一些链接将以平滑的滚动效果将您带到该页面上的特定部分。

为了实现这一点，我使用了 Gatsby 平滑滚动锚链接。文档在这里：https://www.gatsbyjs.org/packages/gatsby-plugin-anchor-links/.

这基本上就是我要实现的目标：

许多网站使用混合导航格式，其中一些链接路由到其他页面，而另一些则将平滑滚动锚定到特定页面内的部分——但这两种类型仍然需要运行良好，无论是什么用户当前所在的页面。

这是我的导航栏代码片段：

             <MDBNavItem className="mr-4">
                <AnchorLink to="/#buy-now" 
                 title="Buy AIEOU">
                  <span>Buy AIEOU</span>
                </AnchorLink>
              </MDBNavItem>
              <MDBNavItem className="mr-4">
                <AnchorLink to="/about" title="Our team">
                  <span>About Us</span>
                </AnchorLink>
              </MDBNavItem>

奇怪的是，当我在本地使用它时，它完全可以正常工作。但是当我将它部署到 Github 页面时它不再起作用了。它不是平滑滚动，而是传送到那个部分。我添加了偏移选项和 StripHash 属性，但它仍然不起作用。如有任何提示，我们将不胜感激。

```

Answer 1

假设你已经把所有东西都配置得很好，而且你说它传送到各个部分（行为是正确的，效果不是）我想你需要添加以下 CSS 规则添加平滑行为：

html,
body {
  scroll-behavior: smooth;
}

Can I use 浏览器的回退。

部署到 github 页面时，Gatsby 平滑滚动锚链接不起作用

Gatsby Smooth Scroll Anchor Links doesnt work when deployed to github pages

javascript

smooth-scrolling

gatsby

gatsby-plugin