如果你需要某个 action，不必自己写复杂的脚本，直接引用他人写好的 action 即可，整个持续集成部署过程，就变成了一个 actions 的组合。...3.自动部署 通过 VuePress 将 Markdown 文件生成静态网站，为了方便手动构建，我写了一个 Shell 脚本： #!...# 脚本出错立即退出 set -e # 生成静态文件，目录为 vuepress-docs/.vuepress/dist npm run docs:build rm -rf docs mv vuepress-docs...因为我经常需要修改书籍内容，为了提高构建部署的效率，我将上述手动操作的过程通过 Github Actions 完成，实现自动化构建部署。...我的工作流需要做如下几件事情： 拉取仓库 安装 Node.js，因为 VuePress 是基于 Node.js 实现的。 执行 npm install 安装 VuePress 和相关插件。
动态 Web 服务各种类型的 Web 应用，提供默认域名、自定义域名、HTTPS 和 CDN 加速等功能，提升 Web 应用的性能和安全性，此外还提供基于 Git 的工作流、DevOps 流程和加速开发部署流程...VuePress ：VuePress 是一个以 Markdown 为中心的静态网站生成器。.../.cache docs/.vuepress/.temp dist 部署项目 1.将代码上传到远程仓库 2.访问 Web 应用托管 控制台，新建应用 从Git仓库导入，授权自己的 git 账号 [新建应用...] 3.选择要导入的项目，然后进行配置 [配置命令] 4.部署成功后，在应用详情页，可以看到项目域名 [应用详情] 5.访问域名就可以看到下图页面 [项目页面] 6.可以到应用设置中，添加自己的域名 [...随后将会触发 Web 应用托管的自动构建及部署。
前言 正常我们利用 Vuepress 搭建一个文档博客之后，往往都是通过如下步骤来部署一篇博客： 首先写文章； 写完文章之后生成静态文件，这里一般使用的是 npm run build 命令，但也有使用...gh-pages 分支，因为 main 分支存放的一般是源码，而 gh-pages 分支则用来存放生成的静态文件 FOLDER: docs/.vuepress/dist # vuepress...如果是绿色的，说明自动部署成功了，如果是红色，那就说明部署失败。这个时候我们可以点进去看看部署失败的日志信息。...我这里错误的大体意思就是说我 Vuepress 项目下的的 dist 目录不存在，而解决方法则是在 Vuepress 的配置文件中的 dist 设置为 docs/.vuepress/dist 即可。...总结 以上就是关于 Vuepress + Github Actions 实现自动部署的所有内容了，如果对你有所帮助，那就帮忙点赞关注吧！ 最后，贴出我的博客地址，可以去看看效果！
动态 Web 服务各种类型的 Web 应用，提供默认域名、自定义域名、HTTPS 和 CDN 加速等功能，提升 Web 应用的性能和安全性，此外还提供基于 Git 的工作流、DevOps 流程和加速开发部署流程...VuePress ：VuePress 是一个以 Markdown 为中心的静态网站生成器。.../.cache docs/.vuepress/.temp dist 部署流程 1.将代码上传到远程仓库 2.访问 Web 应用托管 控制台，新建应用 从Git仓库导入，授权自己的 git 账号 3.选择要导入的项目...，然后进行配置 4.部署成功后，在应用详情页，可以看到项目域名 5.访问域名就可以看到下图页面 6.可以到应用设置中，添加自己的域名 修改代码后，提交至远程 Git 仓库。...随后将会触发 Web 应用托管的自动构建及部署。
vuepress是一款十分优秀简洁的文档生成器，可以根据目录下的md文档自动生成对应的html文件，界面简洁大方。...每一个由 VuePress 生成的页面都带有预渲染好的 HTML，也因此具有非常好的加载性能和搜索引擎优化（SEO）。本文将介绍如何在CentOS7环境下部署vuepress。...{ "scripts": { "docs:dev": "vuepress dev docs", "docs:build": "vuepress build docs" } } 创建.vuepress目录...mkdir .vuepress cd .vuepress 创建config.js，这是vuepress的全局配置文件，大部分属性在这里设置。...dev # 构建，此时会将md文档转化成html文件存储在docs/.vuepress/dist目录 vuepress build 六、调试部署 此时静态网页已经生成在了**docs/.vuepress
VuePress教程之部署到Github Action 本文阅读重点 < 1 VuePress教程之部署到Github Action 1.1 主题的选取：vdoing主题 1.2...安装vdoing主题 1.3 本地部署 1.4 使用Github Action部署 1.5 分享我的 ci.yml配置文件 最近geekzl打算尝试一下VuePress，据说如果用来做文档体验会很不错...主题的选取：vdoing主题 在网上找了一圈vuepress主题，其中vdoing主题让人眼前一亮，就它了。...install # develop npm run dev # or yarn dev 本地部署 本地部署，是基于Shell脚本的。.../deploy.sh即可~ 使用Github Action部署 按作者给的文档 GitHub Actions 实现自动部署静态博客 进行操作 用代码仓库 https://github.com/dbdgs
1.项目初始化 yarn init # npm init 2.安装依赖 将 VuePress 安装为本地依赖 我们已经不再推荐全局安装 VuePress yarn add -D vuepress # npm...{ "scripts": { "docs:dev": "vuepress dev docs", "docs:build": "vuepress build docs" } } 4....安装主题 vuepress-theme-reco yarn add vuepress-theme-reco # npm install vuepress-theme-reco --save-dev ...5.创建.vuepress 文件夹并创建 config.js 配置文件 mkdir docs/.vuepress && touch docs/.vuepress/config.js 编辑 config.js...- title: 高性能 details: VuePress 为每个页面预渲染生成静态的 HTML，同时在页面被加载的时候，将作为 SPA 运行。
第一次使用 VuePress 去部署 Github page，折腾的时间比较长，总结一下坑点。...我的场景： 采用https://.github.io/的形式 自定义二级域名 Travis CI 自动部署 访问地址：https://snippet.noxxxx.com...文档即仓库 我的仓库中只有在根目录下的项目介绍 README.md 和 VuePress 的整个工程。...按照 VuePress 的文档我需要配置 .vuepress/config.js下配置 base: /snippet/, 但是如果你配置了自定义域名，这一步就不需要配置!.../public/CNAME 下写你的域名，VuePress 构建后，CNAME 文件会自动回到根目录。
VuePress 安装vuepress前，请确保你的 Node.js 版本 >= 8 全局安装 # 安装 yarn global add vuepress 或者：npm install -g vuepress...> README.md # 开始写作 vuepress dev . # 构建静态文件 vuepress build ....注意 ：vuepress dev .和vuepress build .后面的.。...在现有项目中安装 # 将 vuepress 作为一个本地依赖安装 yarn add -D vuepress 或者：npm install -D vuepress # 新建一个 docs 文件夹 mkdir...VuePress 网站必要的配置文件是 .vuepress/config.js，它应该导出一个 JavaScript 对象： module.exports = { title: 'VuePress
由 VuePress 生成的每个页面，都具有相应的预渲染静态 HTML，它们能提供出色的加载性能，并且对 SEO 友好。...部署 以下指南假设你将文档放置在项目的 docs 目录中，并使用默认的编译输出位置。 GitHub 页面 将 .vuepress/config.js 中的 base 设置为你的仓库名称。...例如，如果你的仓库是 https://github.com/foo/bar ，则已部署的页面将在 https://foo.github.io/bar 上可用。...在你的项目中，运行： # 构建 vuepress build docs # 导航到构建输出目录 cd docs/.vuepress/dist git init git add -A git commit...gh-page 分支 将 / 替换为你的信息 git push -f git@github.com:/.git master:gh-pages 你可以在 CI 设置中运行此脚本以启用每次推送时的自动部署
创建项目 # 创建项目目录 mkdir vuepress-starter && cd vuepress-starter # 新建一个 markdown 文件 echo '# Hello VuePress...> README.md # 开始写作 vuepress dev . # 构建静态文件 vuepress build ....部署 在部署之前你需要先注册腾讯云账号，到云开发控制台，创建环境、选择按量付费、网站托管、开启静态网站服务，如果用过小程序云开发，可以使用小程序账号快速登入。...1.登入 cloudbase login 2.进入静态文件目录 cd .vuepress 3.部署文件 # 将 dist 目录下的所有文件部署到根目录 cloudbase hosting:deploy...dist -e envId 4.查看静态网站域名和状态 cloudbase hosting:detail -e envId 5.在浏览器打开静态网站域名，就可以看到 云开发部署的 VuePress 网站了
❞ 效果图 使用技术 VuePress + vuepress-theme-reco VuePress简介 VuePress文档地址 简洁至上：以 Markdown 为中心的项目结构，以最少的配置帮助你专注于写作...init 3.将 VuePress 安装为本地依赖 yarn add -D vuepress # npm install -D vuepress ❝官方不推荐全局安装 VuePress ❞ 4.创建你的第一篇文档...10:00:00 # 时间 sidebar: 'auto' # 侧边栏 categories: # 分类 - java tags: # 标签 - vue author: 默存 # 作者 --- 部署...Gitee&GitHub 一、部署 ❝这里使用Gitee作为列子，毕竟国内的速度快。。。...❞ 2.提交代码至创建的仓库（typ1805） 3.部署Gitee Pages 部署 二、浏览访问 https://typ1805.gitee.io 三、更新问题 Gitee Pages 个人版不支持提交自动更新
# 插件 # 插件整理 vuepress-plugin-mermaidjs (opens new window) 流程图、时序图、类图、状态图 ...... vuepress-plugin-baidu-autopush...(opens new window) 百度推送 vuepress-plugin-thirdparty-search (opens new window) 第三方搜索链接 vuepress-plugin-one-click-copy...(opens new window) 代码块复制按钮 vuepress-plugin-zooming (opens new window) 放大图片 vuepress-plugin-comment...Valine方式加入评论 | Valine-Admin (opens new window) 加入邮箱通知 # 插件使用方法 加入插件包 yarn add -D vuepress-plugin-xxx...# npm install -D vuepress-plugin-xxx 使用插件包 module.exports = { plugins: [ [ 'vuepress-plugin-xxx
作为本地依赖安装让你可以使用持续集成工具，或者一些其他服务（比如 Netlify）来帮助你在每次提交代码时自动部署。...之后运行yarn docs:dev访问localhost:8080 也可看见初始页面 部署页面到 GitHub Pages 编写package.json脚本命令 { "scripts": {...' EchoWheel UI', description: '一套为开发者学习准备的基于 Vue 2.0 的移动端和 PC 端组件库', } 之后在根目录创建一个deploy.sh文件，方便编译部署文档...gh-pages git push origin master:gh-pages cd - 关键步骤是git remote添加远程仓库, 如果远程已经有gh-pages（GitHub会自动将此分支代码部署到.../deploy.sh即可正确部署 注意： macos用户需要在运行脚本加权限，执行chmod +x deploy.sh 之后在github 页面的settings里就可以看到页面链接了 主页配置
VuePress 使用 安装 # 全局安装VuePress npm install -D vuepress 本地新建文件夹>vuepress vuepress/新建docs文件夹 vuepress/...创建文件 在docs/README.md中添加代码 # my first vuepress 在package.json中添加代码 { "scripts": { "dev": "vuepress...dev docs", "build": "vuepress build docs" } } 在vuepress中启动命令 npm run dev 启动成功后打开看到以下页面说明vuepress...但是缺点太多了，自己部署服务器环境，装mysql，写后台，写数据库，再写前端...这下来搞得头皮发麻，成果还不尽理想，最关键的是服务器最便宜一年也好好几百。。...现在用github加vuepress，理论上来说，域名是永久可以访问的，这样一个在线文档或博客（根据你自己的配置喜好），并且vuepress也是基于vue的单页应用，访问速度及用户浏览反馈还是很棒的！
项目场景：博客系统(vuepress)部署采用自动部署文档的Github工作流。...问题描述工作流运行过程产生错误"The process ‘/usr/bin/git’ failed with exit code 128 ❌"，导致部署失败。...commit/usr/bin/chmod -R +rw /home/runner/work/javadirection.github.io/javadirection.github.io/docs/.vuepress...q -av --checksum --progress /home/runner/work/javadirection.github.io/javadirection.github.io/docs/.vuepress
分享一个VuePress知识管理&博客 主题 官方文档：https://doc.xugaoyi.com/ github：https://github.com/xugaoyi/vuepress-theme-vdoing
# 用Vuepress重构博客 原本使用typecho作为博客系统，最近服务器快到期了，调研了一下发现vuepress还不错，所以把博客迁移到了vuepress # 前期准备 一个备案的域名 github
VuePress 是社区广受好评的文档插件，不少的项目都开始使用 VuePress 来构建团队的文档、产品的官网。现在，你也可以在云开发上托管你的 VuePress 文档啦！...创建一个云开发环境 完成了本地的 Vuepress 建设，接下来我们来创建一个云开发环境，用来部署 VuePresss 。...接下来，就可以进入到最后一个环节，上传部署 VuePress 了。 部署 VuePress 接下来，我们来构建，并部署 VuePress。...image.png 访问 点击设置，进入设置页面，可以找到默认的的域名，点击域名，就可以看到你刚刚部署的环境啦。...image.png 部署以后是这样的 image.png One More Thing 只需简单的几步，你就可以轻松实现将 VuePress 部署到云开发上，无需再忍受 Github Pages 的龟速啦
超详细动手搭建一个Vuepress站点及开启PWA与自动部署 五一之前就想写一篇关于Vuepress的文章,结果朋友结婚就不了了之了。 记得最后一定要看注意事项！...Vuepress介绍 官网：https://vuepress.vuejs.org/ 类似hexo一个极简的静态网站生成器,用来写技术文档不能在爽。当然搭建成博客也不成问题。...-D vuepress 全局安装vuepress yarn global add vuepress # 或者 npm install -g vuepress 新建一个docs文件夹 mkdir docs...manifest.json ['link', { rel: 'manifest', href: '/manifest.json' }], ], serviceWorker: true, } 部署上线...构建与自动部署 用gitHub的pages或者coding的pages都可以,也可以搭建在自己的服务器上。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM
