使用 Cloud Studio 在线搭建、编辑、部署 Hexo

原文转载自 「HCLonely Blog」 ( http://localhost:4000/posts/a7676fbe/ ) By HCLonely (h1

预计阅读时间 0 分钟(共 0 个字, 0 张图片, 0 个链接)

创建工作空间

  1. 前往Coding注册一个帐号

  2. 登录后点击右上角的Cloud Studio

    Cloud Studio

  3. 点击设置,将 ssh 公钥添加到CodingGithub或者其他的 Git 仓库的个人公钥列表

    SSH

  4. 点击工作空间,新建工作空间

    工作空间

从零开始搭建 Hexo

  1. 工作空间名称能自己看懂就行,运行环境选择预置环境Node.js代码来源,然后创建

    从零开始

  2. 点击刚刚创建的工作空间

  3. 按下键盘Ctrl+~打开终端

  4. 按照官方教程依次输入以下命令就可以了

    npm install hexo-cli -ghexo init blogcd blognpm install
  5. 到这里一个博客就基本搭建完成了,其他的去看Hexo 官方文档就可以了

已经搭建好了 Hexo

  1. 工作空间名称能自己看懂就行,运行环境选择预置环境Node.js代码来源仓库,并在下面输入你源码仓库的SSH地址,然后创建

    我已经搭建好了

  2. 点击刚刚创建的工作空间,它会自动克隆你的源码,你只需要运行npm install命令安装所需依赖就可以了

预览

我们在本地只需运行hexo server就可以在http://localhost:4000预览了,不过用Cloud Studio的话运行hexo server命令后,需要Ctrl+Shift+P打开命令面板,输入preview,选择Preview: Open Preview Tab输入端口号(默认 4000)回车就可以了

插件(可选)

如果你用过 Vscode, 下面可以不用看了,安装你喜欢的插件就可以了

点击左边的Extensions可以安装扩展,这里推荐几个适用于编辑 Hexo 的插件

JavaScript 支持

欢迎使用页面点击安装对JavaScript的支持,右下角会有弹窗,确定即可

Extensions

Markdown Preview Enhanced

Markdown 预览插件

more_vert