Cloud-Studio搭建Hexo

Cloud Studio

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

Hexo

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

随时随地搭建？

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

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

创建仓库

首先，我们打开腾讯开发者平台)（需要注册腾讯云账号），点击右上角 + 号，新建项目。

然后按照图示，开启 pages 服务。

新建工作空间

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

搭建 Hexo

生成所需文件

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

hexo init <folder>
cd <folder>  
npm install

启动服务器

hexo clean
hexo d
hexo s

创建访问链接

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

需要注意的是：端口改为 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，修改url 和root属性。

# 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/。