尝鲜!最新 VitePress 1 版本 + Github action,自动部署个人静态站点 SSG

这篇具有很好参考价值的文章主要介绍了尝鲜!最新 VitePress 1 版本 + Github action,自动部署个人静态站点 SSG。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

今天查看 vue 文档时,刚好看到 vue 官网宣布 VitePress 1 更新了:
尝鲜!最新 VitePress 1 版本 + Github action,自动部署个人静态站点 SSG,github,vue,vitepress,blog,SSG

然后在路上走着走着,突然想着,也许我可以把我的笔记仓库转换成在线文档(毕竟纯粹的 md 笔记,喜欢的人不多)。

同时,由于我很久之前有过这 vuepress 的使用经验,而且前段时间又复习了一下 github action,所以很快就搭建好个人笔记站点了。目前笔记站点只做了 lim-note-web 的内容,等会我会再将 lim-note-vscode 的内容也实现成 SSG 的形式。

至于 lim-note-cli,这一块内容我早有安排(挖的好大好大的坑),没办法那么快实现。

现在就简单分享一下搭建步骤:

  1. 阅读 VitePress 文档,很简单
  2. 可以自己手动设置 md 文档的路径(当然,我是使用脚本自动生成的,实现也很简单,就是使用 DFS 算法遍历路径,然后生成就可以了)
  3. 先本地预览一下,没问题的话,就可以尝试搭建 github action 了

搭建 github action 的方式是:

  1. 在根目录下创建 .github/workflows/deploy.yaml,其中文件名任意,一般是 yaml 文件
  2. 编写对应的 action ,可以参考我的 learn-action。有什么问题可以直接提起一个 issue
  3. push 分支,然后在 settings 中开启 page,指定分支为 dist 即大功告成!

最后,欢迎大家参观我的个人站点,因为内容还很粗糙,所以不期待多少人看。不过以后我会慢慢整理的(好大好大的坑呀😆)。

点击前往我的个人站点

尝鲜!最新 VitePress 1 版本 + Github action,自动部署个人静态站点 SSG,github,vue,vitepress,blog,SSG文章来源地址https://www.toymoban.com/news/detail-844739.html

到了这里,关于尝鲜!最新 VitePress 1 版本 + Github action,自动部署个人静态站点 SSG的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 利用 GitHub Action 对项目进行自动部署

    说一下项目背景,这是一个基于 Docusaurus 搭建的个人博客平台:Yopth.github.io ⚛️ Docusaurs 是一个优秀的搭建网站框架,基于 React 和 MDX,插件化、国际化、SEO 等做的都很不错,有需要搭建网站的同学可以考虑。 该网站利用 GitHub Pages 部署,这个方式也是 Docusaurus 所支持的,详

    2023年04月24日
    浏览(43)
  • 使用 Github Actions 工作流自动部署 Github Pages

    actions顾名思义就是一堆动作,是一个持续集成服务,持续集成包含了拉代码、运行测试、编译代码、登录远程服务器,发布到第三方服务等等的操作,GitHub将这些操作称为actions。 概念:Workflows, Events, Jobs, Actions, Runners Workflows 工作流 一个 Workflow 由多个 Jobs 组成 Events 定义哪

    2024年02月07日
    浏览(73)
  • GitHub Actions自动化部署+定时百度链接推送

    # 前言 最近用VuePress搭建了一个静态网站,由于是纯静态的东西,每次修改完文章都要重新打包上传很是麻烦。虽然vuepress-theme-vdoing主题作者提供了GitHub Actions自动化部署的教程文章,但是过于简陋且是19年发布的。。 # 1. 创建一个GitHub仓库(私有仓库也可以) # 2. 设置服务器地

    2024年02月12日
    浏览(55)
  • 【日常记录】自动化部署与持续交付:GitHub Actions CICD

    当我们做项目的时候,如果做完了,要发布,就需要打包,扔到服务器上,如果改了一点东西,还得打包,扔到服务器上,重复的执行 打包= 扔到服务器上 详细记录如何使用github actions自动化部署项目 自动化部署与持续交付:GitHub Actions CICD 自动化部署一般以下方式 Jenkins

    2024年02月02日
    浏览(65)
  • Github Actions实现Spring Boot自动化部署(第二弹)

    ​ 今天就来讲述一下如何使用GitHub结合Actions实现Spring Boot程序从提交代码到打包、容器化、部署全过程自动化。首先咱们得现有一个能够在本地运行的Spring Boot程序,并且在Github上拥有一个仓库。 1.1 提交代码到Github 1.2 设置服务器密钥、GitHub私钥、DockerHub账号 secret value rem

    2024年02月08日
    浏览(47)
  • GitHub Action 通过SSH 自动部署到云服务器上

    准备 正式开始之前,你需要掌握 GitHub Action 的基础语法: workflow (工作流程):持续集成一次运行的过程,就是一个 workflow。 name: 工作流的名称。 on: 指定次工作流的触发器。push 表示只要有人将更改推送到仓库就会触发工作流运行。(点击这里了解如何指定特定分支,路径

    2024年01月19日
    浏览(48)
  • github-action+docker实现项目可持续自动化部署

    这篇文章以部署vue3项目和nuxt2项目为例结合 github-action , docker , nginx 等介绍不同的项目自动部署流程 部署vue3项目 步骤: 1、腾讯云开启镜像仓库 2、github配置secrets 3、项目根目录创建dockerfile文件(在action工作流中创建镜像) 4、github配置action工作流(yml文件) 上面步骤执行结

    2024年04月26日
    浏览(43)
  • 【版本控制】GitHub图床服务Action---自动监视图床仓库的目录下的文件数

    最近突然想起年前图床仓库发生的一个遗留问题:由于我的网络图床服务是 Github + Typora 的形式,本地的图片会自动转义成网络图片并存储在图床仓库下,一般我们会指定一个目录进行图片存储,但是由于GitHub设定的单个目录最大存储文件数不能超过1000. 所以在注意到这件事

    2024年02月07日
    浏览(53)
  • 04.使用 github actions+docker 自动部署前后端分离项目 zhontai (.net core+vue)

    Github Actions是什么?是 GitHub 提供的一种持续集成/持续部署(CI/CD)工作流程自动化服务,助力项目的自动化构建、测试和部署。 依托于平台,本文将分享使用 GitHub Actions 完成对一个.Net Core+Vue 的前后端分离项目 zhontai 的构建,并使用 docker 部署到云服务器(阿里云) 经过一番尝

    2024年02月11日
    浏览(61)
  • Vitepress部署到GitHub Pages,工作流

    效果: 部署 VitePress 站点 | VitePress 执行 npm run docs:build,npm run docs:preview,生成dist文件   手动创建.gitignore文件: node_modules .DS_Store dist-ssr cache .cache .temp *.local 使用npm install命令创建package-lock.json文件 config.mts文件中添加base,仓库名称 去github,名称一致(这个不确定哈)   在编

    2024年04月08日
    浏览(49)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包