vuepress-theme-reco 博客主题使用

前提

安装vuepress

安装vuepress-theme-reco

安装

npm install vuepress-theme-reco --save-dev

引用

// .vuepress/config.jsmodule.exports = {theme: 'reco'
}

优秀插件安装

插件安装

//内置插件不需要下载安装，直接引用就可以
npm install  <pagkageName> -D   //或  yarn add <pagkageName> -D//pagkageName 为插件全称eg.
//1.音乐播放器
npm install @vuepress-reco/vuepress-plugin-bgm-player -D
//2.樱花特效
npm install vuepress-plugin-sakura -D
//3.动态title
npm install vuepress-plugin-dynamic-title -D

插件引用

// .vuepress/config.jsmodule.exports = {theme: 'reco',plugins: [//音乐播放器['@vuepress-reco/vuepress-plugin-bgm-player',{audios: [{name: '강남역 4번 출구',artist: 'Plastic / Fallin` Dild',url: 'https://assets.smallsunnyfox.com/music/2.mp3',cover: 'https://assets.smallsunnyfox.com/music/2.jpg'},{name: '用胳膊当枕头',artist: '최낙타',url: 'https://assets.smallsunnyfox.com/music/3.mp3',cover: 'https://assets.smallsunnyfox.com/music/3.jpg'}],position: {left: '10px',bottom: '10px','z-index': '999999'},autoShrink: true,floatPosition: 'left',floatStyle: {bottom: '80px','z-index': '999999'}}],//动态标题["dynamic-title",{showIcon: "https://www.zpzpup.com/assets/image/favicon.ico",showText: "欢迎回来 O(∩_∩)O~",hideIcon: "https://www.zpzpup.com/assets/image/favicon.ico",hideText: "失联中。。。快回来~",recoverTime: 2000}]]
}

参考

vuepress-theme-reco一款简洁而优雅的 vuepress 博客 & 文档主题。https://vuepress-theme-reco.recoluan.com/介绍 | vuepress-theme-reco一款简洁而优雅的 vuepress 博客 & 文档主题。https://vuepress-theme-reco.recoluan.com/views/1.x/

优秀案例

优秀博客案例 | vuepress-theme-reco一款简洁而优雅的 vuepress 博客 & 文档主题。https://vuepress-theme-reco.recoluan.com/views/other/theme-example.html

vuepress-theme-reco 博客主题使用相关推荐

vue论坛网站的文章自动排版_基于 VuePress 定制个人博客网站
VuePress 简单来说,VuePress 是 Vue 驱动的静态网站生成器.VuePress 简单易上手,同时也有足够强大的定制能力,尤其对熟悉 Vue 的前端开发人员而言.相比于知名的博客生成器 ...
使用vuepress搭建静态博客
什么是vuePress vuePress是以vue驱动的主题系统的简约静态网站生成工具(拥有自己的默认主题). veuPress由vue,vue-router,webpack驱动的单页面应用,每个ma ...
基于 Vuepress 搭建个人博客，文章详细，助你快速上手
搭建博客几年前在小白阶段使用过 WordPress + 阿里云服务器搭建了自己的博客,也走了很多坑,从零摸坑最后也弄好了,也顺便使用了阿里云的一些服务.但当时没有记录笔记的习惯,过了好久很多操作也 ...
WordPress博客主题KRATOS双栏响应式博客主题
简介: 本次介绍的是一款开源的博客主题,很适合个人博客使用. 首页上方导航栏,带有banner图,布局为双栏布局,多端自适应,无需为手机平板设备单独适配. 安装: 首先下载主题的zip文件,然后上传到 ...
typecho博客主题 “Freedom-冷文”
简介: typecho博客主题 'Freedom-冷文' 一款符合现代人审美的左右分栏式主题,前台内置了管理员管理中心,可以轻松设置为有自己特色的主题,无需三方插件,即可快速使用. 下载主题并上传至T ...
手把手教你使用 VuePress 搭建个人博客
手把手教你使用 VuePress 搭建个人博客有阅读障碍的同学,可以跳过第一至四节,下载我写好的工具包: git clone https://github.com/zhangyunchencc/vu ...
主题狗themes.dog-精选上百种优秀开源网站主题、博客主题、商城模板
说明主题狗themes.dog 精选上百种优秀开源网站主题.博客主题.商城模板. 类型包含 hexo .jekyll .hugo .next .vuepress .gatsby .wordpress ...
2020年64种最佳免费WordPress博客主题
Are you looking for a free WordPress blog theme for your website? 您是否正在为网站寻找免费的WordPress博客主题? There ...
【开发环境】（基于Hexo）个人博客主题（Hexo Fluid）更换
目录一.Hexo Fluid: 二.安装主题: 指定主题: 创建「关于页」: 三.更多自定义设置: 一.Hexo Fluid: Hexo Fluid 用户手册 (fluid-dev.com)http ...
Hexo博客主题安装和优化（一）
当你看到这篇文章的时候,想必你已经搭建好了属于你的Hexo博客并且已经部署到了Github上面,如果还没有的话呢,请移步去Hexo+github搭建博客! 因为默认的Hexo主题实在太难看了,所以我们 ...

vuepress-theme-reco 博客主题使用

前提

安装vuepress-theme-reco

优秀插件安装

参考

优秀案例

vuepress-theme-reco 博客主题使用相关推荐

最新文章

热门文章