在Laravel项目中使用Vuepress

Question

我实际上正在运行一个Laravel网站，我想在其中运行Vuepress文档部分。

由于说明，安装Vuepress非常简单，开发服务器也是如此。

然而，当把它整合为一个静态网站时，我有点迷失与Laravel的互动。

我的所有文档都位于我的Laravel应用程序根目录下的docs文件夹中。

我设法设置Vuepress'config.js将静态站点构建到另一个文件夹中。

base: '/docs/',
dest:'./public/docs',

执行上述操作后，公开文档完全暴露于Web（在公用文件夹中）。

但是，我正在寻找的是将它更精确地集成到Laravel中（使用我创建的中间件和路由）。

Answer 1

Method 1

1. Install vuepress in /docs in your laravel directory

2. Configure vuepress with the correct base and dest

/docs/.v UE press/config.就是

module.exports = {
  dest: 'public/docs',
  base: 'docs/',
};

3. Enable laravel views to include files from the /public directory

/app/config/view.PHP

...
'paths' => [
    resource_path('views'),
    base_path('public'), // now blade's @include will also look in /public
],
...

4. Create a laravel route for vuepress that allows .html extension

/routes/Web.PHP

use View;
Route::get('/docs', function() {
  View::addExtension('html', 'php'); // allows .html
  return view('docs.index'); // loads /public/docs/index.html
});

Method 2

或者通过Laravel更多地控制资产，您可以在这里尝试本教程：https://serversideup.net/vuepress-within-a-laravel-application/

Answer 2

# install as a local dependency
yarn add -D vuepress # OR npm install -D vuepress

# create a docs directory
mkdir docs

# create a markdown file
echo '# Hello VuePress' > docs/README.md

的package.json

{
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  }
}

/docs/.v UE press/config.就是

module.exports = {
  dest: 'public/docs',
  base: '/docs/',
};

npm run docs:build

/routes/Web.PHP

Route::get('/docs', function() {
    return File::get(public_path() . '/docs/index.html');
});