Cloud Studio搭建Hexo

Cloud Studio

Cloud Studio是在线集成开发环境,它提供了完整的 Linux 环境, 并且支持自定义域名指向。IDE 中有近 20 种开发环境,支持一键切换,进度实时保存。

Hexo

快速、简洁且高效的博客框架,Hexo依赖于Node.js,并且使用Markdown解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

随时随地搭建?

我们都知道,Github码云Coding都免费提供了静态网页托管服务,我们写好的代码上传到托管平台,通过pages服务可以实现外网访问。文章开头所述,Cloud Studio提供了完整的 Linux 环境,并且进度实时保存,我们只要有浏览器就可以随时开发并且部署,配合Pages服务,不用买服务器,就可以拥有自己的博客系统。

说了这么多,就是想让大家了解一下工作原理,下面让我们开始吧!

创建仓库

首先,我们打开腾讯开发者平台)(需要注册腾讯云账号),点击右上角+号,新建项目。
《Cloud Studio搭建Hexo》
然后按照图示,开启pages服务。
《Cloud Studio搭建Hexo》

新建工作空间

打开Cloud Studio)官网,点击新建工作空间,来源选择“腾讯云开发者平台”,项目选择上一步创建的仓库,运行环境选择Hexo
《Cloud Studio搭建Hexo》

搭建Hexo

生成所需文件

由于我们选择的运行环境为Hexo,所以工作空间自带了Node.jsGithexo-cli。我们只需要运行以下命令就可以。

hexo init <folder>
cd <folder>  
npm install

启动服务器

hexo clean
hexo d
hexo s

创建访问链接

通过Cloud Studio右侧栏“访问链接”测试是否成功。
《Cloud Studio搭建Hexo》

需要注意的是:端口改为4000,选择创建链接,然后点击创建的链接即可访问。

部署到Pages

安装 hexo-deployer-git

npm install hexo-deployer-git --save

修改 _config.yml 参数

打开站点配置文件_config.yml,修改deploy属性。

deploy:
    type: git
    repo: https://gitee.com/giteetop/giteetop.git
    branch: master

repo:你的仓库地址,可以是
Github
Gitee以及
Coding

部署

hexo clean
hexo g -d

过程中输入仓库的账号和密码,等待提交完成,然后就可以生成静态页面了。

常见问题

如果生成静态页面后,发现页面没有样式了,这是因为使用了域名访问,但是没有配置url路径。
打开站点配置文件_config.yml,修改urlroot属性。

# URL

## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com/
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

如果您的网站存放在子目录中,例如
http://yoursite.com/blog,则请将您的
url 设为
http://yoursite.com/blog 并把
root 设为
/blog/

    原文作者:阿业
    原文地址: https://segmentfault.com/a/1190000020125922
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞