乐趣区

Cloud-Studio搭建Hexo

jiezi

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

退出移动版