How to add Vuepress on a Nuxt project in a proper way?

Question

I have my Nuxt app and I'm trying to add Vuepress on it. I did yarn add vuepress@next -D then created the docs folder and a readme.md file in there.

The problem: The project only shows the sidebar and navbar if the .vuepress folder is outside of the docs folder; If it's inside, it won't work - Not respecting the config.js rules.

Also, it's recognising the readme.md from the Nuxt app (outside from docs folder too), not the one inside docs folder.

Can anyone help me with that?

Another question, if this above works, Am I be able to access through localhost:3000/docs instead of localhost:3000 for the Nuxt project and localhost:8080 for the docs?

That's my current folder structure (no sidebar showing - not respecting the config.js inside the .vuepress folder):

docs
  |__.vuepress
  |     |__config.js
  |
  |__guides

The config.js file:

module.exports = {
  title: 'Documentation',
  description: 'Documentation',
  themeConfig: {
    sidebar: 'auto',
    nav: [{
        text: 'Home',
        link: '/'
      },
      {
        text: 'Guides A',
        link: '/guides/apis/'
      },
      {
        text: 'item with subitems',
        items: [{
            text: 'Subitem 01',
            link: '/'
          },
          {
            text: 'SubItem 02',
            link: '/'
          }
        ]
      },
      {
        text: 'External',
        link: 'https://google.com'
      },
    ]
  }
}

Vuepress version 1.0.2

Thanks.

score 2 · Accepted Answer · edited Jul 14 '19 at 12:07

2

Why you need to use both of these? If you using Nuxt you don't actually need VuePress. Check the official VuePress documentation.

Nuxt

Nuxt is capable of doing what VuePress does, but it is designed for building applications. VuePress is focused on content-centric static sites and provides features tailored for technical documentation out of the box.

edited Jul 14 '19 at 12:07

Martijn Pieters

1,048,767
296
4,058
3,343

answered Jun 26 '19 at 04:36

Sabee

1,763
9
19

I do need it as the Vuepress Docs will be written on NetliftCMS by a few more users. That's why my main Nuxt application will have a Vuepress Documentation. – Fabio Zanchi Jun 26 '19 at 05:20
1

@FabioZanchi Since your use-case is funky, there won't be a proper way – Menasheh Jul 01 '19 at 20:30
Thank you guys. I'm gonna create a separated project for the docs. – Fabio Zanchi Jul 01 '19 at 23:52

How to add Vuepress on a Nuxt project in a proper way?

1 Answers1