Use package.json version in MD files for Vue Press

Question

I'm trying to utilise the package.json version tag inside of my *.md files which get later compiled into HTML, however I can't seem to figure out how to do this. My plugin.js files contains the following which I thought I could utilise:

const { version } = require('../../package.json')

module.exports = (/*options, ctx*/) => ({
  async enhanceAppFiles () {
    const code = `export default ({ Vue }) => {
  Vue.mixin({
    computed: {
      $version () {
        return '${version}'
      } 
    }
  })
}`
    return [{
      name: 'vuepress-plugin-vue-cli-plugin-p11n',
      content: code
    }]
  }
})

I tried using version and $version inside of my *.md files with little luck, has anyone else got this issue?

Answer 1

The easiest way to achieve this, it's simply put the version into themeConfig and let VuePress do its thing

// .vuepress/config.js
const { version } = require('../../package')

module.exports = {
  themeConfig: {
    version: version
  }
}

and use it in markdown like

{{ $themeConfig.version }}

However, it seems like that themeConfig isn't meant for this, so you can also create your own computed properties

// .vuepress/enhanceApp.js
const { version } = require('../../package')

export default ({ Vue }) => {
  Vue.mixin({
    computed: {
      $version: function() {
        return version
      }
    }
  })
}

and use it like

{{ $version }}