内容目录安装初始化核心配置导航栏配置侧边栏配置静态资源配置nginx部署typora编写安装初始化全局安装npm install -g vuepress创建目录mkdir vurepress-blog项目初始化,初始化完成生成package.json文件cd vurepress-blog npm init -y在当前目录中创建docs目录,存放博客书籍内容mkdir docs配置首页显
一、为什么要自己动手写插件呢,原因有二:  其一:是因为最近产品了提了一个在web端接收,消息通知的需求,产品要求在若干个页面内如果有消息,就要弹出消息弹窗展示给用户,略加思索之后,第一反应就是写个消息的组件,在需要的页面引入,不过写好之后,发现这样写好麻烦,是不是可以写个插件在全局一次性引入呢?  其二:纯粹的想学习一下vue的插件是如何开发的二、既然有想法了,那就开始写呗,先去查看了vue的官
针对使用 vuepres养成习惯文章目录效果怎么整?效果演示案例:://javapub.net.cn/先看下效果:代码怎么整?插件地址:
原创 2022-04-19 16:03:36
5004阅读
10分钟搭建个人博客关于VuePress环境搭建安装node8.0+node官网(opens new window)安装官网提示下载安装包安装即可安装完成后打开命令行工具,输入node -v,若返回版本信息则安装成功。创建博客工程# 安装vuepress npm install vuepress -g # 安装脚手架工具 npm install @vuepress-reco/theme-cl
vuepress官方教程,em...也是用vuepress搭建的,哈哈。这句很经典,也是表明了vuepress最好的用处:VuePress 专注在以内容为中心的静态网站上,同时提供了一些为技术文档定制的开箱即用的特性。使用这个框架,不需要服务器,不需要空间,只要有支持pages的git托管仓库就可以搭建一个技术文档站点,任性!当然你也可以放到自己的服务器上直接作为静态网站使用,无所谓。我这里使用的
随着开源项目knife4j添加的新特性越来越多,搭建一个开源软件的技术博客迫在眉睫,针对非专业前端的开发者来说,能快速搭建一个网站当然是最好的,正好,看到了VuePress这款产品特点简直是和自己完美契合,主要有几点;通过编写Markdown文件就可以轻松完成整个站点的内容输出,不用考虑排版,专注于协作基于Vue、Node等技术的可插拔式的自定义插件开发体系,构建自定义的主题、插件等简单、方便安装
转载 2024-05-07 13:47:01
26阅读
4.1 项目结构首先说明一下官方推荐的目录结构:4.2 创建项目文件夹可以右键手动新建,也可以使用 mkdir 命令新建:mkdir vuepressBlogDemo全局安装 VuePressnpm install -g vuepress进入 vuepressBlogDemo 文件夹,初始化项目 使用 npm init 或 npm init -y(默认yes)npm init -y4.3 创建文件
转载 2024-07-24 17:43:34
100阅读
花了2天多的时间总算搭出一个博客的雏形了。 搭建的博客没有使用官方提供的主题,而是自己创建了一个主题。所以,在样式上,有自己的风格和特点。转入正题。 环境搭建安装VuePressyarn global add vuepress 或者:npm install -g vuepress 也可以直接下载我的代码。然后cnpm i 下载依赖 https://github.com/newway7/blog
转载 2024-02-29 06:50:12
55阅读
在项目扩展到一定程度,我们会对项目中大量的公共业务做封装,当多人开发时就带来一个问题:如何让所有人快速使用封装好的组件,降低学习成本?这里提供一个解决方案,那就是Vuepress框架,最新的 Vuepress2.x 框架已经蓄势待发,支持Vue3.x。一、创建一个基础Vuepress项目1、创建并进入一个新目录创建VuepressDocs目录mkdir VuepressDocs cd Vuepre
转载 2024-06-27 17:13:24
246阅读
前言在上一篇文章 vuepress(一):搭建个人博客插件的使用基础用法module.exports = { plugins: [ 'vuepress-plugin-xxx', .... ] }Babel 式module.exports = { plugins: [ [ 'vuepress-plugin-xxx', { /* options */ }
转载 2024-05-25 16:41:32
39阅读
前段时间,docsify 的cdn崩了,我翻了一下很久之前的笔记,打开贼慢不说,样式全没了。于是下定决心找个时间看看有什么好的文档工具重新弄一个,虽然都是几年前的笔记文档,但毕竟这些笔记见证了我的成长,不能丢。最终选定了vuePress2,下面将记录使用 vuePress2 的详细过程。vuepress官方文档https://v2.vuepress.vuejs.org/zh/使用 vuepress
1 什么是VuePressvuePress是以vue驱动的主题系统的简约静态网站生成工具2 如何搭建?在官方网址上说的其实很清楚的,这边简要的说一下2.1 利用npm 安装 vuepress# 初始化 npm npm init -y # 安装 yarn global add vuepress # 或者:npm install -g vuepress # 新建一个 docs 文件夹 mkdir
转载 2024-02-22 16:43:50
97阅读
说明最近想把常用的一些干货知识点都集中起来,方便发布和查找。相当于创建一个自己的知识库,我就叫它Java技术文档。虽然博客写文档也挺方便,但是在于文档的集中阅读和管理方面还是不够简洁和快速。此处就以Vue官方文档举例,它就是用的自家技术vuepress创建的。关于vuepresshttps://www.vuepress.cn/关于github pagesGithub Pages其实等于jekyll
最终效果使用方式页面效果一、需求vitepress-theme-demoblock插件在编辑md文件时,不支持TSX模式,也无法import其他依赖,并且展开隐藏的vue代码都在md文件中,不够优雅,且每个md文件太长。至此弃用此拆件,改用自己封装demo组件二、plugins配置:在docs/.vitepress下新建config文件夹1、在config文件夹新建global.ts文件,代码如下
转载 2024-04-10 20:37:50
157阅读
Vuepress Vuepress 从名字上看就知道
原创 2022-07-24 00:35:51
313阅读
       百家饭团队开发的百家饭OpenAPI平台是用vuepress2.0搭建的,搭建的时候不知道2.0还处在beta状态,所以导致后来踩了一些坑,使用过程中vuepress2.0也从2.0.0-beta.18升到了2.0.0-beta.48,有很多的变化,所以想写一个教程介绍一下vuepress2.0的情况以及使用经验。大致计划写这些内容吧:vuep
转载 2024-03-29 13:48:27
56阅读
续?VuePressVuePress-theme-hope 搭建个人博客 1【快速上手】项目常用命令 vuepress dev [dir] 会启动一个开发服务器,以便让你在本地开发你的 VuePress 站点。 vuepress build [dir] 会将你的 VuePress 站点构建成静态文件,以便你进行后续部署。使用模板如果使用 VuePress Theme Hope
转载 2024-07-31 13:00:50
45阅读
一、Node环境安装1.进入Node官网,下载19.0.0版本,安装到Windows系统。 https://nodejs.org2.安装pnpmnpm install -g pnpm安装以后,可以使用上述命令升级到最新版本。 二、VuePress安装进入vuepress的官网,按照指引安装。 https://v2.vuepress.vuejs.org/1.建立目录mk
Vuepress 使用 github actins 实现自动部署说明在使用 Vuepress 写完文档后,就是部署了。那么如果每次都手动打包的话,比较麻烦,所以就使用 github 提供的自动部署服务, actions 来实现自动部署。配置首先是在使用 github actions 时,需要配置下 vuepress 项目的配置文件,看你需要部署在xxx.github.io/xxx/ 上,还是 xx
       百家饭团队开发的百家饭OpenAPI平台是用vuepress2.0搭建的,搭建的时候不知道2.0还处在beta状态,所以导致后来踩了一些坑,使用过程中vuepress2.0也从2.0.0-beta.18升到了2.0.0-beta.48,有很多的变化,所以想写一个教程介绍一下vuepress2.0的情况以及使用经验。这里先给搜索进来的同学提个醒:
  • 1
  • 2
  • 3
  • 4
  • 5