在VuePress 1.x中，对pageKey使用<Content>标签不起作用 - 腾讯云开发者社区

# 简介当前版本为 1.x 2.x 版本使用文档迁移至这里 # 安装 $ yarn add vuepress-theme-yur 修改配置文件，启用主题 module.exports = {...- 标签一 - 标签二 banner: /20190101/banner.jpg --- 参数说明 date 创建日期 update_date 更新日期 tags 标签，第一个为主标签...}, }, }; # 落下帷幕 module.exports = { themeConfig: { curtain: { tip: '页面准备中...在 MarkDown 中使用 name：图标名称 color：颜色 size：大小（建议使用 em 单位） # 升级升级到指定版本 1.0.1 $ yarn upgrade vuepress-theme-yur@1.0.1

1.4K3 2

使用VuePress 搭建个人博客

首先在当前目录下创建 .vuepress 目录（所有 VuePress 相关的文件都放在此目录下），然后在 .vuepress 目录下创建 config.js 文件（也可以使用YAML (.vuepress...description: '顾斯比的博客', // 网站的描述，它将会以标签渲染到当前页面的 HTML 中。...安装 yarn add @vuepress/theme-blog -D # OR npm install @vuepress/theme-blog -D 使用&配置在config.js 中添加主题相关配置...frontmatter 中设置 search 来对单独的页面禁用内置的搜索框： --- search: false --- 「⚠️提示」「内置搜索只会为页面的标题、****h2」「、」「h3」...参考链接 Intro to VuePress 1.x：https://ulivz.com/2019/06/09/intro-to-vuepress-1-x/ 默认主题配置：https://vuepress.vuejs.org

1K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

实践 Vue3 组件库-基于 VuePress 开发组件文档

basic.vue --> 按钮一按钮二在文档中自定义一个标签引入...使用 posthtml-parser 解析 demo 的标签 src 属性(使用这个包是为了方便扩展解析)。...; } return rawRule(tokens, idx, opts, env, self); }; } 在 parseCodeBlock 中解析标签的属性、存储到缓存、读取文件内容等一系列操作后...add(compPath); // 读取文件，生成新的标签结构。 // tag: 节点的名称，在 vue 文件中是组件名。...// attrs: 节点的属性，在 vue 文件中是 props 属性。 // content: 子节点，在 vue 文件中用 slot 渲染。

2651 0

VuePress网站如何使用axios请求第三方接口

前言 VuePress是一个纯静态网站生成器,也就是它是无后端,纯前端的,那想要在VuePress中,发送ajax请求,请求一些第三方接口,有时想要达到自己一些目的在VuePress中，使用axios...请求第三方接口，需要先安装axios，然后引入，最后使用本文包括 VuePress中安装和使用axios,直接使用与挂载在根实例下使用解决跨域的问题,VuePress中使用axios请求第三方接口时...版本组件内使用axios 在单文件见组件中引用axios,然后使用axios.get()与axios.post()发送get请求或post请求 ...中,我试了,发现不起作用,不知道为什么,有知道的朋友可以告诉我一下,谢谢如果想要全局进行使用axios,把它挂载到Vue根实例下,则可以全局引入,如果不这样,那在组件当中,在使用axios之前,每次都需要按需引入的...$axios = axios; } 那在组件中,使用时,只需要this.axios.get(),或this.axios.post(),就可以了的,无需单文件组件前每次都引入axios了的其实,引入Jquery

1K6 0

Mybatis-PageHelper分页插件的使用与相关原理分析

留言前言今天使用了分页插件，并将其整合到SpringBoot中。各种遇到了个别问题，现在记录下。吃一垫长一智。整合与SpringBoot整合 1. 引入依赖 <!...配置参数接着在application.yml中配置相关参数 #pagehelper pagehelper: helperDialect: mysql reasonable: true...配置拦截器（这是核心，如果不配置则分页不起作用）在Spring的配置文件中配置拦截器插件 <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean...原理其最核心的方法就在拦截器中，那我们首先看看拦截器中的拦截方法。该方法主要做了两件事，1. 统计总条数，2.对原始的SQL进行改写使其可以分页。...对sql进行分页对sql 进行分页的入口逻辑还是在PageInterceptor类的intercept方法中。话不多说，上代码。

7202 0

PageHelper分页插件怎么这么好用

配置参数接着在application.yml中配置相关参数 #pagehelper pagehelper: helperDialect: mysql reasonable: true...配置拦截器（这是核心，如果不配置则分页不起作用）在Spring的配置文件中配置拦截器插件 <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean...原理其最核心的方法就在拦截器中，那我们首先看看拦截器中的拦截方法。该方法主要做了两件事，1. 统计总条数，2.对原始的SQL进行改写使其可以分页。...分解sql存入SelectBody的实现类PlainSelect中，主要的部分是selectItems，fromItem，where 然后就是将selectItems替换成count(0) 最后在组装成...对sql进行分页对sql 进行分页的入口逻辑还是在 PageInterceptor类的 intercept方法中。话不多说，上代码。

8034 0

使用vuepress-6小时搭建一个完全免费的个人网站

[pikn9n1r7u.png] 分享一个通过vuepress搭建个人博客当然也可以自己写不用vuepress，自己写代码然后通过githubPages也是可以的，只是使用vuepress相对来说时间快一点...一、个人网站的作用：个人相册，笔记，个人小说，员工手册，公司制度文档，等等像UmiJS，DvaJS的文档也是使用的vuepress，可以参考一下他的网站我们可以随意的更换侧边栏的信息，比如公司概况...克隆以后的目录完成好了以后，我们可以看到文件夹中多了一个vuepress文件夹 [ey1iewdtmj.png] docs文件夹在这个文件夹目录下，我们还是需要安装一下依赖生成node_modules...关于默认主题中config.js文件中themeConfig的配置其实配置很简单，可以参考一下vuepress官方文档，写的非常详细默认主题配置下面是我的一些themeConfig:配置信息以及我的...官方是1.x 的文档，由于目前 1.x 仍处于 alpha 阶段，在到达 beta 阶段之前，有些 API 可能会变化、应用也可能不够稳定，所以看文档时可以看下面这个 https://v0.vuepress.vuejs.org

3K3 1

一看就会的保姆级教程，10分钟搭建个人博客

标签中需要额外插入的其它标签默认生成的是： "head": [ // 在head标签中生成以下标签 [ "link", // 生成link标签 {...] 当然我们也可以继续添加别的标签，例如： "head": [ // 在head标签中生成以下标签 ["link", { "rel": "icon", "href": "/favicon.ico...content: '零一' }], ] （5）theme 该属性表示的是当前项目使用的主题这里我们是用 vuepress-theme-reco 主题的脚手架生成的，所以它默认就是 reco ，我们可以不用修改...其实就是 blogConfig 中设置的 "blogConfig": { "category": { "location": 2, // 在导航栏中的位置在第二个...另外，我们本文使用的主题框架还为文章提供了一个很不错的功能：加密，只需要在文章中给keys属性赋值一个md5加密后的字符串即可比如我们将密码设为zero2one，那么打开在线md5加密 (opens

1.8K2 0

微信开放文档是个病，得治！

$page.key 是关键点，首先 render 函数中的 h 很重要，在 Vue 中代表的意思是 hyperscript 用来在当前 Vue 组件系统中，找到对应的组件或者 HTML 标签来渲染。...为了解决这个问题，微信开放文档中涉及到的对应跨模块 router-link 都需要改动为 a 标签。不过，这里对微信开放文档的编译是直接按照产品线模块划分。...这里对 layout 的改动只要把大模块的 list 中 router-link 修改为 a 标签即可。 ? CDN 资源路径处理 Vuepress 的编译系统是基于 webpack 来的。...render 之实际应用在微信社区中，会用到两个比较重要的组件，一个是 ClientOnly，一个是 Content。...Content: 在 routes 里面注册 md 组件内容，通过 parent.key 找到对应节点并渲染。上面可能就 ClientOnly 对大家比较有价值，这里会重点说一下。

1.4K2 0

VuePress-theme-hope2 搭建个人网站，保姆级教程，包含自动部署、评论、搜索等功能

好处是可以使用 Markdown 来书写内容文档或者博客。 VuePress 诞生的初衷是为了支持 Vue.js 及其子项目的文档需求。在明确你的目标之后，先不着急立马搭建项目。...下滑之后文章的列表如下：文章的列表来自于项目中所有的markdown文件，你可以在每个md文件的frontmatter中设置文章的标题、封面、分类、标签、日期、是否在文章列表中显示。...站点的基本信息、顶部的hero信息、项目链接、底部的footer信息都可以在README.md中配置。...侧边栏侧边栏的配置在 sidebar.ts中侧边栏的配置，我们可以分两种情况：全局导航栏、根据每个导航栏栏目分离式导航栏。...全局侧边栏配置你可以设置侧边栏导航和导航栏的路由一一对应，这样就相当于是全局的侧边栏。

1061 0

用我这套模板，几分钟做出文档网站！

使用 VuePress 工具，我们可以在 head 配置中添加网站 head 标签信息，比如设置站点图标、设置有利于 SEO（搜索引擎优化）的元信息、添加第三方统计分析代码等：head: [ // 站点图标...Markdown 配置VuePress 的基本功能就是把我们写的 Markdown 文件渲染成网站，我们可以在 markdown 配置中自定义网站的渲染规则，比如显示代码块的行号、支持更细层级的标题渲染等...然后在 config.ts 中引用。...所以这里我帮大家做了减法，在模板中只保留了我认为有用的核心插件。...meta 标签内容，比如把文章描述、标签信息放到标签中，从而增加收录率。

6061 0

VuePress V1 踩坑记录

1.Node.js 版本问题使用vuepress dev docs在本地启动服务器时报了如下错误： Error: error:0308010C:digital envelope routines::...2.侧边栏在 VuePress 的侧边栏分组配置中，children 的路径是相对于 docs 目录的路径，而不是相对于分组的路径。...在 VuePress 的官方网站中，对 config.js 中的 base 做了说明。部署站点的基础路径，如果你想让你的网站部署到一个子路径下，你将需要设置它。...在 config.js 中添加 meta 标签，去掉 referrer。 module.exports = { .......vuepress 目录的同级 assets/imgs，然后在 .vuepress/config.js 中配置如下，但不生效。

6163 0

开发工具总结（15）之Vuepress制作文档并发布到GitHub

全局安装markdown-it-katex-external， 4.然后在config.js中设置markdown节点，如下： // 对markdown的配置 markdown: { /...6.在markdown中的使用：在markdown文件开头加入以下两个css链接，然后再去写katex语法即可。...vuepress\dist\目录，可以在本地使用，也可以部署到github或者服务器。...相当于 HTML 中的标签。...”/“） base: "/vuepress_usage/", 额外的需要被注入到当前页面的 HTML 中的标签时，配置head项，这里是自定义的favicon： head: [ [

4K5 0

Vue.js最佳静态站点生成器对比

因此在本文中，我会向大家介绍用于静态站点生成的四大 Vue.js 框架，并对它们做详细对比，帮助找到适合你用例的选项。 1. Nuxt.js ?...但在 1.x 版发布之后，VuePress 演变成了静态文件生成器。...在 VuePress 中，每个页面都被视为一个 markdown 文件，它们被渲染为 HTML 页面，并在加载页面时充当一个单页应用程序。...GitHub 统计数据这块，VuePress 的存储库有超过 17800 个星和 340 多位贡献者。FinTech、IADC 和 Directus 等公司也在使用它。优点更好的加载性能。...与 React 中的 Gatsby 相似，Gridsome 是一个数据驱动的框架。Gridsome 使用一个 GraphQL 层从各种源中获取内容，然后从中动态生成页面。

5.1K1 0

Vuepress SEO优化教程(附完整方法)

img标签都加上alt 17 高阶技巧：使用JSON-ld结构化数据 18 SEO得分: 97 真不是沪小羊吹啊，Google给沪小羊的vuepress网站的SEO水平打97分。...具体操作，就是在markdown的frontmatter中把 permanentlink 设置成相对路径即可。...meta优化使用插件 webmasterish/vuepress-plugin-autometa 可以自动生成meta标签及其内容，包括 meta keywords, meta description...移动端优化 head中增加如下两行，已加的话就不用重复加了~ content="IE=edge"> 中的img标签都加上alt img加上alt可替换文字是很必要的，防止img无法加载时，也能起到描述图片的功能。

4.1K2 0

vuepress中实现代码折叠、高亮

最近在vuepress中撰写UI框架文档时发现在组件中插入演示代码没高亮，虽然在文档markdown中写代码有高亮但就无法实现折叠了，而且vuepress没有提供折叠代码的配置，因此实现一个折叠组件外加代码高亮的插件就十分有必要...一、编写代码折叠mixin.js 在/docs/.vuepress下创建mixin.js文件，编写代码折叠逻辑。...，效果如图：可点击显示隐藏代码二、高亮代码在组件中插入代码想使得代码语法高亮可以用highlight插件 1....全局引入 enhanceApp.js中引入highlight插件,这里使用与element-ui一样的color-brewer主题 import '....使用之后在包装代码的外层div加上v-highlight指令，并在code标签标明代码模板类型为html/javascript/css content"

2.1K4 0

如何在百度搜索到我的网站？

~ 若不是使用vuepress搭建博客，而是使用其他方式的话，其实都是大同小异，根据自己的需求去更改提交方式即可~ 前置条件首先你需要有一个百度账号（没有的话需要自己先注册哦~附上链接，记得点击立即注册...~）你需要有一个域名（github page提供的应该也可以哦~）通过这个域名可以正确访问到你的博客或网站若是使用 vuepress-theme-vdoing 主题，可以一步一步完成你的百度收录...vuepress博客在 docs/.vuepress/config.ts 中的 head 添加如下内容 ['meta', {name: 'baidu-site-verification', content...: '百度标签中的code'}], 普通博客步骤将百度提供的代码写入到你的网站标签中例： <meta name="baidu-site-verification...接下来的方法都是基于你的代码已经托管于Github 如果你使用的vue的技术栈的话，我觉得此方法应该都是可行的~只是需要修改部分的代码编写文件生成 urls.txt 文件生成方法，放入utils文件夹中

1.7K2 0

VuePress教程之深入理解插件API

Pluggable是 VuePress 1.x 的最重大改变。 vuepress 提供给开发者许多 API 来打造他们的插件，VuePress 本身的许多功能也是依靠插件化实现的。...在配置中，VuePress 增加很多 markdown-it 插件（其中大多数是 VuePress 建立的）。然后 VuePress 会开始执行来跟上面相同的方法配置 markdown-it。...VuePress 会在找出源文件夹中的所有页面档案后开始处理他们。它会产出页面的 title 和 headers、处理 frontmatters 等等。这些信息会被储存用来在之后渲染时使用。...globalUIComponents 注入某些全局的 UI，并固定在页面中的某处。在页面都被处理完后，VuePress 会执行。...他会产出一些暂存档案来让 VuePress 客户端可以使用。你可以在查看。

1.2K1 0

VuePress 搭建站点

VuePress 是静态站点生成框架之一，界面简介优雅，本文记录使用方法。...vuepress 在 nodejs 平台下安装 vuepress npm install -g vuepress # 或 yarn global add vuepress 使用方法创建框架以 Cellink...项目的说明文档为例，创建 cellink-docs 文件夹 mkdir cellink-docs 初始化项目 npm init -y 在 VueDemo 文件夹中创建 docs 文件夹，在其中加入...在 docs 中创建 .vuepress 文件夹，在.vuepress中创建 public 文件夹和 config.js 文件，最终项目结构如下所示： VueDemo ├─── docs │ ├─...locales: { '/': { // 多语言下拉菜单的标题 selectText: 'Languages', // 该语言在下拉菜单中的标签

6691 0

7个实用的 Vue.js 工具和库

它只是用 Vue 代码替换了常规的 Bootstrap 组件中的JavaScript。...借助 Bootstrap Vue，你可以使用 Vue.js 和世界上最受欢迎的前端 CSS 库——Bootstrap v4 在 Web 上构建响应式、移动优先和 ARIA 可访问的项目。...5：VuePress 网站：https://www.vuepress.cn/ Github：https://github.com/vuejs/vuepress Github stars:17.1k...VuePress 是 Vue 生态系统中的另一大重头戏。...从版本 1.x 开始，它提供了出色的博客功能和强大的插件系统。它有一个默认主题（适用于技术文档），但你也可以构建自定义主题或使用社区中的预制主题。

3.2K5 2

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

vuepress-theme-yur 使用教程

使用VuePress 搭建个人博客

实践 Vue3 组件库-基于 VuePress 开发组件文档

VuePress网站如何使用axios请求第三方接口

Mybatis-PageHelper分页插件的使用与相关原理分析

PageHelper分页插件怎么这么好用

使用vuepress-6小时搭建一个完全免费的个人网站

一看就会的保姆级教程，10分钟搭建个人博客

微信开放文档是个病，得治！

VuePress-theme-hope2 搭建个人网站，保姆级教程，包含自动部署、评论、搜索等功能

用我这套模板，几分钟做出文档网站！

VuePress V1 踩坑记录

开发工具总结（15）之Vuepress制作文档并发布到GitHub

Vue.js最佳静态站点生成器对比

Vuepress SEO优化教程(附完整方法)

vuepress中实现代码折叠、高亮

如何在百度搜索到我的网站？

VuePress教程之深入理解插件API

VuePress 搭建站点

7个实用的 Vue.js 工具和库

扫码

相关资讯

热门标签

活动推荐

运营活动

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐