mac下搭建hexo并部署到github

1.安装Node.js

安装地址:nodejs.org,下载LTS长期支持版,安装。
mac下搭建hexo并部署到github_第1张图片

  • 打开终端,切换到root用户
  • 查看node版本,包管理器版本
    mac下搭建hexo并部署到github_第2张图片
    安装nodejs已经完成

2.开始真正安装hexo框架

 使用淘宝镜像比较快:
 npm install -g cnpm --registry=https://registry.nmp.taobao.org
  • 安装完成后查看cnpm版本:cnpm -v

mac下搭建hexo并部署到github_第3张图片

  • 用cnpm安装hexo博客:

     cnpm install -g hexo-cli
    
  • hexo -v查看版本号
    mac下搭建hexo并部署到github_第4张图片

3.开始使用hexo正式搭建博客

  • 首先把查看路径是否在用户目录下

    pwd
    
  • 建立一个空的文件夹:

    mkdir blog
    
  • 所有博客东西都在blog文件夹生成,出现错误就把这个目录删了就行

  • 进入目录:

    cd blog
    

mac下搭建hexo并部署到github_第5张图片

  • 使用hexo生成博客:

      sudo hexo init
    
  • ls -l查看目录下生成了博客基础框架内容
    mac下搭建hexo并部署到github_第6张图片

4.启动博客

 hexo start
 或者
 hexo s 

如下图,在localhost:4000
在这里插入图片描述

  • 我们在浏览器访问一下localhost:4000,我们看到里面自己生成了helloword文章,并且简介了hexo怎么使用。

mac下搭建hexo并部署到github_第7张图片

5.创建文章

  • 根据我们上面浏览器给出的hexo的用法我们来建立自己的文章。并查看自己的文章。

    hexo n "文章名"
    
       或者
    
    hexo new "文章名"
    
    cd source/_posts/
    
    ls -l
    

mac下搭建hexo并部署到github_第8张图片

6.编辑文章

  • vim 我的第一篇文章.md

  • 然后基于markdown编写就可以了

mac下搭建hexo并部署到github_第9张图片

  • 退回blog文件目录,先清理一下再生成,再重新启动

     cd ../..
    
    hexo clean
    
    hexo g
    
    hexo s
    

在这里插入图片描述

  • 刷新网页:mac下搭建hexo并部署到github_第10张图片

7. 将博客部署到github

  • 创建一个新仓库,如图所示,名字必须是你的用户名+github+io

mac下搭建hexo并部署到github_第11张图片

  • 在blog目录下安装git部署插件

    cnpm install --save hexo-deployer-git
    

在这里插入图片描述

  • 设置_config.yml做如下修改
    在这里插入图片描述

  • 部署到远端

    hexo d
    
  • 输入账号密码

  • 刷新github:

mac下搭建hexo并部署到github_第12张图片

  • 直接用仓库名访问。代替了localhost:4000

博客部署结束

关于部署后图片无法显示问题

1.修改blog目录下_config.yml文件

post_asset_folder:false 修改为:true

2.安装图片路径转换插件

npm install https://github.com/7ym0n/hexo-asset-image --save

3.我们再创建博客文档时候会自动生成一个文件夹,将我们的图片放入文件夹,引用格式如下:

![](./文件夹名/文件名.npg)

你可能感兴趣的:(工具使用)