VitePress

介绍

VitePress是Vue.js驱动的静态网站生成器。

环境要求： 最少Node.js v18.16.1版本

node安装与配置看我的其他文章

安装配置

  1. 新建一个文件夹叫VitePress，cmd打开后输入：
1
2
pnpm add -D vitepress
pnpm vitepress init
  1. 其他配置查看本仓库项目和官网进行2次配置

参考链接：

用来部署静态博客或者前端文档很不错

image-20260705154825453

image-20260705154917198

VuePress

介绍

VuePress是Vue.js驱动的静态网站生成器。

环境要求： 最少Node.js v16.14版本

node安装与配置看别的文章

安装配置

  1. 新建一个文件夹叫vuepress，cmd打开后输入：
1
2
3
4
pnpm init    对包管理器进行初始化
pnpm add -D vuepress   安装vuepress的本地依赖

mkdir docs && echo '# Hello VuePress' > docs/README.md  创建你的第一篇文档
  1. 在package.json里修改成下面的：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
{
  "name": "lucky",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "vuepress": "^1.9.9"
  }
}
  1. 在本地服务器启动：
1
pnpm docs:dev

可以搭建公司的UI组件库

image-20260705152448812

image-20260705152353176

常见问题

无法启动解决方案：

正常Node.js 16版本就不会有问题的，如果遇到启动失败，尝试以下命令：

1
set NODE_OPTIONS=--openssl-legacy-provider && vuepress dev docs

配置放入启动那也行，一般是node版本太低了。

VSCode中pnpm运行问题：

如果VSCode不能运行pnpm，去管理员终端运行这个：

1
set-ExecutionPolicy RemoteSigned

访问地址

启动成功后访问：http://localhost:8080/