不止极客

切换主题


这里是一个广告位，Try now →
成为不止极客的付费会员

这个网站修改记录.md ​

启动错误 ​

‘vite’ 不是内部或外部命令，也不是可运行的程序或批处理文件

解决办法

安装对应的依赖 npm i

vitepress 的选择 ​

对比 vuepress 和 vitepress 之后发现 vitepress 更加适合

TODO: 增加 PWA 提高访问速度 ​

https://vitepress.dev/reference/site-config#example-registering-a-service-worker

参考：本人博客的 PWA

TAGS 还有 POST 列表 参考： ​

正心全栈编程

https://space.bilibili.com/162101364

https://zhengxinonly.com/

https://notes.zhengxinonly.com/

正心的心路历程 ​

https://notes.zhengxinonly.com/posts/2023-09-21.html

正心全栈编程里边，有一个他介绍的 tailwind css 的样式 ​

https://notes.zhengxinonly.com/posts/2023-09-03.html

伪类显示 如果你熟悉 CSS 的样式，例如 hover、active 等伪类属性，这些在做原生开发的时候编写起来非常麻烦，但是在 tailwind 下使用时非常的方便。

我们创建一个简单的按钮，给左右边距为 my-2，设置为大号圆角 rounded-lg，背景颜色为 bg-blue-500，左右边距为 px-4 ，边距为 py-2，字体颜色为 text-white，最终结果如下。 html 1 当鼠标放在按钮上时，使其背景颜色变的更深，可以追加属性 hover:bg-blue-700，当鼠标再次放上去时，背景颜色就会发送变化。

如果当鼠标聚焦是有边框，可以使用 focus:outline-none 去除，然后使用 focus:ring 追加边框，使用 focus:ring-blue-300 添加自定义的淡色边框。使用 active:bg-blue-900 在鼠标点击按钮时使其颜色值更深。

TODO：替换原有的一些别人的数据 ​

xaviw.github.io XaviDocs

html 元素的居中 ​

https://juejin.cn/post/6844903821529841671

添加自动生成目录 ​

https://xaviw.github.io/XaviDocs/工具系列/VitePress搭建/自动生成目录.html

https://github.com/Xaviw/vite-plugin-vitepress-auto-nav/blob/master/README.md

响应式，双向绑定 ​

NoGeekProduct.vue

  • 监听路由变化进行刷新
  • 定时刷新

TODO:添加短链接 ​

https://justin3go.com/博客/2023/08/18给vitepress增加短链接生成功能.html

https://justin3go.com/博客/2023/03/31极简地给个人博客添加订阅功能.html

TODO: 添加 rss ​

vitepress-plugin-rss https://www.npmjs.com/package/vitepress-plugin-rsshttps://www.cnblogs.com/roseAT/p/17649853.html

MPA ​

https://vitepress.dev/guide/mpa-mode

  • 方式一
    • vitepress build --mpa
  • 方式二：修改 config.ts
    • mpa: true

TODO: 影集的展示页面 ​

https://www.toobug.net/article/bmm-2.html

未来做作品集的展示页面特别的不错

这个页面其实很不错，还在问作者要源码

Configuring TailwindCSS to work with Vitepress ​

这个页面需要整个 TailwindCSS 到 vitepress 里边

https://codybontecou.com/tailwindcss-with-vitepress.html

但是我没有做好

查询 tailwind 的 Class

https://tailwind.build/classes

TODO:自动部署 ​

自动打包部署Github Pages

https://hanochma.github.io/blogs/common-skill/2023-05-26-github-workflow

Full list of slots available in the default theme layout:

When layout: 'doc' (default) is enabled via frontmatter:

  • doc-top
  • doc-bottom
  • doc-footer-before
  • doc-before
  • doc-after
  • sidebar-nav-before
  • sidebar-nav-after
  • aside-top
  • aside-bottom
  • aside-outline-before
  • aside-outline-after
  • aside-ads-before
  • aside-ads-after

When layout: 'home' is enabled via frontmatter:

  • home-hero-before
  • home-hero-info
  • home-hero-image
  • home-hero-after
  • home-features-before
  • home-features-after

When layout: 'page' is enabled via frontmatter:

  • page-top
  • page-bottom

On not found (404) page:

  • not-found

Always:

  • layout-top
  • layout-bottom
  • nav-bar-title-before
  • nav-bar-title-after
  • nav-bar-content-before
  • nav-bar-content-after
  • nav-screen-content-before
  • nav-screen-content-after

NOT:给VitePress博文加上标签 ​

未来可以做好博客标签搜索，现在已经有了搜索，又有了文件夹分类其实这个需求也没那么紧急了

https://ceil.top/CODES/vitepress-with-tags.html

NOT:vitepress 中增加 twitter/x 卡片 ​

这个没有实践过，不知道行不行。所以未来在做打算

https://justin3go.com/博客/2023/09/28vitepress中增加twitter卡片.html

CloudFlare 部署错误 ​

js
14:22:54.407	Success: Finished cloning repository files
14:22:55.205	Detected the following tools from environment: npm@9.6.7, pnpm@8.7.1, nodejs@18.17.1
14:22:57.189	Installing project dependencies: pnpm install
14:22:58.099	 ERR_PNPM_OUTDATED_LOCKFILE  Cannot install with "frozen-lockfile" because pnpm-lock.yaml is not up to date with package.json
14:22:58.100	
14:22:58.100	Note that in CI environments this setting is true by default. If you still need to run install in such cases, use "pnpm install --no-frozen-lockfile"
14:22:58.101	
14:22:58.101	    Failure reason:
14:22:58.101	    specifiers in the lockfile ({"@types/node":"^20.6.0","gray-matter":"^4.0.3","vite-plugin-vitepress-auto-nav":"^1.2.2","vitepress":"1.0.0-rc.20","vue":"^3.3.4"}) don't match specs in package.json ({"gray-matter":"^4.0.3","vite-plugin-vitepress-auto-nav":"^1.2.2","vitepress":"^1.0.0-rc.20","vue":"^3.3.4","@types/node":"^20.6.0"})
14:22:54.407	Success: Finished cloning repository files
14:22:55.205	Detected the following tools from environment: npm@9.6.7, pnpm@8.7.1, nodejs@18.17.1
14:22:57.189	Installing project dependencies: pnpm install
14:22:58.099	 ERR_PNPM_OUTDATED_LOCKFILE  Cannot install with "frozen-lockfile" because pnpm-lock.yaml is not up to date with package.json
14:22:58.100	
14:22:58.100	Note that in CI environments this setting is true by default. If you still need to run install in such cases, use "pnpm install --no-frozen-lockfile"
14:22:58.101	
14:22:58.101	    Failure reason:
14:22:58.101	    specifiers in the lockfile ({"@types/node":"^20.6.0","gray-matter":"^4.0.3","vite-plugin-vitepress-auto-nav":"^1.2.2","vitepress":"1.0.0-rc.20","vue":"^3.3.4"}) don't match specs in package.json ({"gray-matter":"^4.0.3","vite-plugin-vitepress-auto-nav":"^1.2.2","vitepress":"^1.0.0-rc.20","vue":"^3.3.4","@types/node":"^20.6.0"})

在本地代码执行 重新安装包管理

sh

pnpm i

pnpm i
shell

npm install pnpm -g

npm install pnpm -g

NOT:添加时间线 vitepress-markdown-timeline ​

考虑其实没有那么需要

SH

# NPM
$ npm install vitepress-markdown-timeline

# Yarn
$ yarn add vitepress-markdown-timeline

# pnpm
$ pnpm install vitepress-markdown-timeline

# NPM
$ npm install vitepress-markdown-timeline

# Yarn
$ yarn add vitepress-markdown-timeline

# pnpm
$ pnpm install vitepress-markdown-timeline

https://juejin.cn/post/7237007450178814011

参考文档 ​

friends

不止极客

Released under the MIT License.

Copyright © 2023-present noGeek.cn