Vuepress -定制组件

Question

我是Vuepress的新人。我想做一个以Vuepress为主题的博客-可以从github获得：

https://github.com/vuepress/vuepress-theme-blog

官方文档显示了如何更改某些内容，例如页眉、页脚……作为颜色，链接..。这里有更多信息：

https://vuepress-theme-blog.ulivz.com/config/#nav

要使用from module.exports对象自定义文件config.js中的allow参数：

module.exports = {
  themeConfig: {
    nav: [
      {
        text: 'Blog',
        link: '/',
      },
      {
        text: 'Tags',
        link: '/tag/',
      },
    ]
  },
}

但我想要更改完整的导航栏组件。只有这一点，我找到了进去的路：

/node_modules/@vuepress-themeblog/components/Header.vue

总之，我想知道创建新组件的最佳方式。也许直接在主题的components文件夹中更改是更好的选择，或者有什么方法吗？

我很困惑在文档中只显示了一些小的变化。

你能给我一些建议吗？

谢谢!

Answer 1

您不应该编辑node_modules目录中的代码，因为它是由包管理器管理的第三方代码。你可以通过创建自己的主题来解决你的问题，使用vuepress-themeblog作为起点。

documentation中描述了编写自定义主题的步骤。将vuepress-theme-blog repository的内容复制到您的theme文件夹中，并开始处理您的自定义组件。