Hexo博客框架—轻量、一令部署

2022年05月11日 阅读数:5
这篇文章主要向大家介绍Hexo博客框架—轻量、一令部署,主要内容包括基础应用、实用技巧、原理机制等方面,希望对大家有所帮助。

为何要使用Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其余渲染引擎)解析文章,在几秒内,便可利用靓丽的主题生成静态网页。Hexo支持Github Flavored Markdown的全部功能, 甚至能够整合Octopress的大多数插件. 并本身也拥有强大的插件系统。前端

经过本教程中,你将从头开始构建本身的应用,分别使用Hexo CLI 和 云开发平台node

Hexo-CLI 快速搭建项目

1、搭建本地开发环境

● Hexo 须要Node.js 版本不低于 10.13,建议使用 Node.js 12.0 及以上版本。您可使用n、nvm或nvm-windows 在同一台机器上管理多个版本的Node。 要了解如何安装 Node.js,参阅nodejs.org。 若是你不肯定系统中正在运行的 Node.js 版本是什么,请在终端窗口中运行node -v。git

● npm 包管理器 由于咱们一般都会使用Hexo 提供的脚手架搭建项目结构,因此要下载并安装 npm 包。本指南使用 npm 客户端命令行界面,该界面默认安装在 Node.js。要检查你是否安装了 npm 客户端,请在终端窗口中运行 npm -v 。github

● 你可使用 Hexo CLI 来建立项目,生成应用和库代码,以及执行各类持续开发任务,好比测试、打包和部署。npm

要安装新软件包,请使用如下命令之一:json

npm install -g hexo-cli

● 进阶安装和使用windows

对于熟悉 npm 的进阶用户,能够仅局部安装 hexo 包。浏览器

npm install hexo

安装之后,可使用如下两种方式执行 Hexo:服务器

  1. npx hexo <command>hexo

  2. 将 Hexo 所在的目录下的 node_modules 添加到环境变量之中便可直接使用 hexo <command>:

echo 'PATH="$PATH:./node_modules/.bin"' >> ~/.profile

2、建立新的初始应用

● 要想建立一个新的初始应用项目,请执行:

hexo init <folder>

● 新建完成后,指定文件夹的目录以下:

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

3、启动应用服务器

进入工做区目录,并启动这个应用。

cd <folder>
npm install
hexo server

hexo server命令会构建本应用、启动开发服务器、监听源文件,而且当那些文件发生变化时从新构建本应用,

也会打开浏览器,并访问 http://localhost:4000/

你会发现本应用正运行在浏览器中。

参考文献:https://hexo.io/zh-cn/

云平台一键部署Hexo

1、建立环境

想要一键部署Hexo,须要如下帐号和服务:

● Github帐号 ( https://github.com/ ),

● 阿里云帐号,并使用阿里云帐号登陆云开发平台 ( https://workbench.aliyun.com/ ),为保证最好的使用体验,请使用Chrome浏览器。开通OSS服务。

● 未开通阿里云OSS的用户,点击连接 (https://workbench.aliyun.com/product/open?code=oss )开通OSS服务。OSS开通免费,有必定的免费额度,超过额度以后按量付费。

file

2、建立Hexo应用

● 建立前端应用。打开快速开始 https://workbench.aliyun.com/app ,找到Hexo点击建立「建立应用」按钮。

file

● 云资源访问受权。若是您以前没有使用过云开发平台,会出现云资源受权管理的选项,往下拉出现直至赞成受权的字样,点击「赞成受权」后出现受权成功,点击进入「下一步」。

file

● 绑定Github帐号。受权完成后选择来源仓库为Github,按照提示点击去绑定,绑定GitHub账号,登陆后并点击Authorize Aliyunworkben容许云开发平台构建、发布你的GitHub代码为可访问的网站。

file

● 选择fork好的“Hexo”代码仓库。选择第一步中的代码仓库,主干分支,并点击下一步。主干分支通常指的是代码的master或main等分支。

file

填写基本信息,完成建立。填写基本信息并点击「完成」。成功后进入到应用详情和部署界面。

file

3、在平常环境部署

● 一键进行应用部署。在应用详情页面点击平常环境的「部署」按钮进行一键部署,部署状态变成绿色已部署之后能够点击访问部署网站查看效果。

file

● 访问Hexo网站。平常环境的测试域名也是能够访问的,点击访问已部署网站按钮会出现一个弹出,点击弹出上的当即访问就可以访问已经部署好的站点了。在部署完成后,能够继续本地编码,并将代码push到应用的“基本信息”中对应的代码仓库内。

file

阿里云开发多端应用平台

框架不论是平常工做、学习都会涉及到的领域,既如此挑选一款适合本身的应用不止操做起来更顺畅同时也使身心愉悦,带来一天的好心情。

●那诸多的应用怎么去挑选合适本身的呢?

● 每个都去下载、去看相关操做文档去实验?

● 又或者听取同窗、同事的建议用着其中一款?

● 但是每一个人的使用场景、需求、特征都同样吗?

● ······

带着以上诸多疑惑进入云开发平台,有多种框架映入眼帘例如:Vue.js、React、Nuxt.js、Next.js、AntDesign等,其中还能看到一些内容管理平台例如:Hexo、Docusaurus、VuePress、Sapper等。在此条件下咱们先挑一个较为感兴趣的应用点开去尝试部署,会发如今原来线上部署应用真的像在手机上下载APP同样简单、快速。一个如此、其余便皆是大同小异了,多尝试一些应用发现每一个的相同与不一样,天然而然挑选最适合本身需求的应用去在平常所用便可。

忙不完的活,作不完的工做,工做效益最高化是我的都在追求的,那劳逸结合必是确定的。云开发平台也有一些小游戏去帮助你们缓解当心情,相似头像生成器、2048等。玩着本身部署出来的应用成就感可就加倍呢,若是不喜欢游戏的总体布局、颜色等,那也能够根据从云开发平台部署的经验在去原有代码基础上去修改、部署等。这样专属本身的一款游戏就出来了呢,若是有心爱之人送给她这也合成不是一种浪漫呢!

file