Configuration VuePress配置中的前置内容默认值

我正试图将我的文档站点从GitBook切换到Vuepress，却被前端变量卡住了。在GitBook中，您只需在配置中添加变量，然后在页面的任何位置使用它们，如

{{{book.variable\u name}

。在Vuepress中，乍一看，事情似乎更加棘手

我需要配置几个在整个站点中使用的变量，因此将它们添加到每个页面将是一场噩梦。该文档没有说明如何配置前端变量，但有一个指向Jekyll站点的链接。在Jekyll网站上，我发现这正是我想要实现的。问题是我不知道如何在配置中使用这些信息

---

非常感谢您的帮助。我在中问了这个问题，但没有帮助。

要定义一些可以在站点中任何位置访问的变量，可以将它们添加到主题配置中

如果还没有，请在

.vuepress/config.js

上创建一个

config.js

文件

此文件应导出一个对象

您想将一个

ThemeSeconFig:{}

添加到该文件中

您在

ThemeSeconfig

对象上设置的属性将在整个站点的

$ThemeSeconfig

上可用

//- .vuepress/config.js

module.exports = {
  themeConfig: {
    //- Define your variables here
    author: 'Name',
    foo: 'bar'
  }
}

通过使用全局计算函数，还可以轻松地覆盖本地/每页。（这也可以提供一种更干净的方式来访问变量）

在与

config.js

相同的位置添加一个

enhanceApp.js

文件，将使您能够访问Vue实例，您可以在其中为所有组件定义一个mixin

您可以在此mixin中定义一些计算属性，首先检查页面frontmatter数据中的值，然后返回到themeConfig中设置的值。允许您设置一些默认值，这些默认值可以在每页本地覆盖

//- .vuepress/enhanceApp.js

export default ({ Vue }) => {
  Vue.mixin({
    computed: {
      author() {
        const { $themeConfig, $frontmatter } = this
        return $frontmatter.author || $themeConfig.author
      },
      foo() {
        const { $themeConfig, $frontmatter } = this
        return $frontmatter.foo || $themeConfig.foo
      }
    }
  })
}

---

Frank非常感谢，这正是我想要实现的目标。这里只有一个问题-vuepress中的标记不会自动转换从变量获取的链接并将其显示为字符串：

[Google.com](https://google.com)

这是预期的吗？我认为这是预期的-但您也可以在标记文件中使用Vue组件和HTML元素。所以你可以做

，或者如果它是一个内部链接，你甚至可以像

链接文本那样使用Vue路由器。好的，明白了。谢谢你的帮助！
//- .vuepress/enhanceApp.js

export default ({ Vue }) => {
  Vue.mixin({
    computed: {
      author() {
        const { $themeConfig, $frontmatter } = this
        return $frontmatter.author || $themeConfig.author
      },
      foo() {
        const { $themeConfig, $frontmatter } = this
        return $frontmatter.foo || $themeConfig.foo
      }
    }
  })
}


  {{ author }}  //- 'Name'
  {{ foo }} //- 'bar