I'm getting broken index.html
after vuepress build docs
with lots of Failed to load resource: net::ERR_FILE_NOT_FOUND
in console.
vuepress dev docs
, however, works totally fine!
My steps:
yarn add -D vuepress
; -docs
|
--.vuepress
| |
| --config.js
|
--guides
| |
| --README.md
--info
| |
| --README.md
|
--README.md
My config.js:
module.exports = {
title: 'Hello VuePress1',
description: 'Just playing around',
themeConfig: {
nav: [
{ text: 'Home', link: '/' },
{ text: 'Guide', link: '/guide/' },
{ text: 'Вернуться в приложение', link: '/desktop/' }
],
sidebar: [
'/',
'/guides/',
'/info/'
]
}
}
Now, vuepress dev docs
gives at localhost:8080
exactly what i expect - everything is fine.
vuepress build docs
generates dist
folder, which contains:
Problem arises on opening index.html
. Everything is displayed without CSS and links are not working. Seems like problems with paths to assets...
Why everything doesn't work properly out of the box in a completely new project?
The paths to the CSS and JS files in index.html
are absolute (starts with /
), so viewing index.html
using the file protocol doesn't work (you need to host it on a server so the HTTP protocol are used).