VuePress安装及使用

前言

VuePress 是一个以 Markdown 为中心的静态网站生成器。你可以使用 Markdown 来书写内容(如文档、博客等),然后 VuePress 会帮助你生成一个静态网站来展示它们。

例如:JavaFX 前言 这个博客网站就是使用 VuePress 生成的,你只需要使用 Markdown 来书写文章内容,其他的 VuePress 帮你搞定

VuePress 相比于其他以 Markdown 为中心的静态网站生成器,如 mdBook 、GitBook、Hexo、Nuxt、VitePress、Docsify 、Docute 更加简单方便,如果你会前端你还可以自己定制主题。

一、依赖环境

  • 安装的 Node.js 版本需要大于等于 18.16.0
  • 包管理器,如 npm 或者 pnpm、yarn 等。

若你还没安装 Node.js,可以参考 Node.js安装与配置 进行下载安装。

二、vuepress 安装和使用

1.初始化

新建一个文件夹,我这里新建的文件夹叫 vuepress ,打开 cmd 窗口进入 vuepress 文件夹所在路径。

然后 cmd 命令行中输入下面的命令,将初始化生成一个 package.json 文件:

npm init -y

2.将 VuePress 安装为本地依赖

npm install -D vuepress@next

3. package.json 中添加脚本

在 package.json 中的 scripts 里添加两行启动脚本

	"docs:dev": "vuepress dev docs","docs:build": "vuepress build docs"

最终的 package.json 长这样:

{"name": "vuepress","version": "1.0.0","description": "","main": "index.js","scripts": {"test": "echo \"Error: no test specified\" && exit 1","docs:dev": "vuepress dev docs","docs:build": "vuepress build docs"},"keywords": [],"author": "","license": "ISC","devDependencies": {"vuepress": "^2.0.0-rc.0"}
}

4. 新建 docs 文件夹。

在 vuepress 文件夹下新建 docs 文件夹,用于存放所有的 Markdown 文件。

在 docs 文件夹下新建 README.md 文件,你可以在 README.md 写点内容。

5.启动

执行如下命令启动,启动成功后,会在 docs 下自动生成 .vuepress 文件夹,用于配置。

npm run docs:dev

启动后,你可以浏览器打开 http://localhost:8080/ 查看刚才的 README.md 渲染效果 。

下面是我 README.md 渲染效果

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/283879.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

「Verilog学习笔记」交通灯

专栏前言 本专栏的内容主要是记录本人学习Verilog过程中的一些知识点,刷题网站用的是牛客网 timescale 1ns/1nsmodule triffic_light(input rst_n, //异位复位信号,低电平有效input clk, //时钟信号input pass_request,output wire[7:0]clock,output reg…

Kotlin 笔记 -- Kotlin 语言特性的理解(二)

都是编译成字节码,为什么 Kotlin 能支持 Java 中没有的特性? kotlin 有哪些 Java 中没有的特性: 类型推断、可变性、可空性自动拆装箱、泛型数组高阶函数、DSL顶层函数、扩展函数、内联函数伴生对象、数据类、密封类、单例类接口代理、inter…

PostgreSQL常用命令

数据库版本 :9.6.6 注意 :PostgreSQL中的不同类型的权限有 SELECT,INSERT,UPDATE,DELETE,TRUNCATE,REFERENCES,TRIGGER,CREATE,CONNECT,TEMPORARY,EXECUTE 和 USAGE。 1. 登录PG数据库 以管理员身份 postgres 登陆,然后通过 #psql -U postgres #sudo -i -u postgres …

备赛笔记——2024全国职业院校技能大赛“大数据应用开发”赛项——任务2:离线数据处理

MySQLhttps://www.mysql.com/ 将下发的ds_db01.sql数据库文件放置mysql中 12、编写Scala代码,使用Spark将MySQL的ds_db01库中表user_info的全量数据抽取到Hive的ods库中表user_info。字段名称、类型不变,同时添加静态分区,分区字段为etl_da…

【PWN】学习笔记(三)【返回导向编程】(下)

目录 课程回顾ret2libc![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/ebe1a9a9e54f4319946621dbe89c5774.png)做题 ret2libc2ret2libc3 课程 课程链接:https://www.bilibili.com/video/BV1854y1y7Ro/?vd_source7b06bd7a9dd90c45c5c9c44d12e7b4e6 课程…

互联网加竞赛 python 机器视觉 车牌识别 - opencv 深度学习 机器学习

1 前言 🔥 优质竞赛项目系列,今天要分享的是 🚩 基于python 机器视觉 的车牌识别系统 🥇学长这里给一个题目综合评分(每项满分5分) 难度系数:3分工作量:3分创新点:3分 🧿 更多资…

4.配置系统时钟思路及方法

前言: 比起之前用过的三星的猎户座4412芯片,STM32F4的系统时钟可以说是小巫见大巫,首先我们需要清晰时钟产生的原理:几乎大多数的芯片都是由晶振产生一个比较低频的频率,然后通过若干个PLL得到单片机能承受的频率&…

模拟IC设计-学习笔记

写在前面:本文是我自己学习b站上up主(jrilee讲电路)的模集课程时记的笔记,原课程:模拟IC设计 第一讲 -- Device and modeling (I)_哔哩哔哩_bilibili 目录 器件基础 求输出电阻 MOS管的小信号模型,拉扎维书上常用的是π模型&am…

Flutter ios 使用ListView 。滚动时 AppBar 改变颜色问题

在Ios 中 列表滚动条向下滚动一段距离后 会导致 AppBar 颜色改变 可以给 AppBar 或者 AppBarTheme。 scrolledUnderElevation: 0.0 属性 全局: MaterialApp(theme: ThemeData(appBarTheme: AppBarTheme(scrolledUnderElevation: 0.0)) ) 局部: App…

硬件基础-电阻

电阻 1.品牌 厚声、风华,三星、罗姆、松下、KOA 2.分类 插件 碳膜电阻:精度-5 J 是在高阻,高压和高温应用中 属负温度系数电阻 金属膜:-1 F 贴片 电阻标识:(含义:阻值大小和精度&a…

keithley 吉时利6221源表

特点 优势 10 14 Ω 输出阻抗 提供广泛的输出阻抗,确保负载中有稳定的电流源。 65000 点源内存 允许直接从电流源执行全面的测试电流扫描。 输出 0.1V 至 105V 的恒流电压,10mV 步长 防止潜在损坏对过电压敏感的设备。 源交流电源范围为 4pA 至…

AI聊天伴侣的语料采集大揭秘:OpenCV如何轻松识别聊天图片?

最近,负责元宇宙中AI聊天伴侣的语料数据采集,这些数据主要用于AI虚拟角色聊天的训练和测试。虽然语料获取有多种渠道,但由于部分数据涉及隐私,这里就不多说了(感兴趣的朋友可以私聊我)。今天,我…