zoukankan      html  css  js  c++  java
  • gitee+hexo搭建个人博客

    通过gitee和hexo搭建个人博客

    本文首发:https://www.somata.net/2019/build_blog_with_gitee_hexo.html

    首先准备软件:

    链接:https://pan.baidu.com/s/1OWnJMV1kI86aLUZZEkt6Yw 提取码:im6o 这里整合好了。

    还有码云主页

    安装

    nodejs、git、notepad++和7z的安装过程省略。主要要说的是hexo的安装和配置。
    再以上几个安装好后,注意测试是否可以再命令行可以使用:git,npm
    这里虽然使用的是Windows值作但是全部都是使用命令完成,与Linux的命令相同,所以可以Linux也是可以完成的。
    Win+R-> 'cmd' 打开命令行
    首先需要配置npm的国内源

    npm config set registry https://registry.npm.taobao.org		#配置国内的镜像源
    npm info hexo	# 测试查看hexo的安装信息,是否是taobao.org的源
    

    然后再是安装hexo:

    npm install -g hexo 		# 通过npm安装hexo
    # -g 指定全局安装,可以使用hexo命令
    

    我这里再切换到桌面路径进行操作

    hexo init test		# 初始化创建,会再桌面创建test文件夹
    cd test				# 进入test目录
    npm install			# 进一步安装hexo所需文件
    

    这样hexo就安装完成了,接下来就可以启动hexo

    hexo clean			# 清除所有记录
    hexo generate		# 生成静态网页
    hexo server -p 80	# 启动服务
    

    然后使用浏览器访问http://server_ip

    主题配置

    如果不喜欢这个主题可以换一个
    比如next主题,next官网 next的github网页,去github下载压缩包然后放到test下的themes目录下。

    然后配置_config.yml

    ……
    theme: hexo-theme-next-5.1.4		# 这里需要注意:后面要有一个空格,名称要和theme下的主题目录名称相同。
    ……
    

    hexo的其他配置参考hexo官方文档
    next的配置参考next官方文档

    然后重启hexo服务

    hexo clean			# 清除所有记录
    hexo generate		# 生成静态网页
    hexo server -p 80	# 启动服务
    

    然后重新访问网页,就会发生变化

    生成blog

    生成blog:

    hexo new test		# 生成主页,在test/source/_posts下会生成test.md文件
    

    所有网页都时通过md文件来显示的,如果想要学习md->markdown语法,可以参考原作者markdown解释

    上传到gitee

    gitee主页
    再gitee创建自己的账户,然后再创建一个自己仓库

    在创建仓库完成后进入到仓库

    复制URL,到hexo的配置文件_config.yml

    ……
    deploy:
      type: git					# type为git
      repo: https://gitee.com/somata/somata	# 仓库的URL
    ……
    

    这里先安装一个hexo的插件

    npm install hexo-deployer-git --save	# 安装git插件
    git config --global user.email *********@qq.com	# 设置gitee邮箱(gitee的注册邮箱)
    git config --global user.name '****'			# 设置用户名(git的注册昵称)
    hexo deploy	# 上传到gitee
    # 在上传时,需要再次输入gitee的注册邮箱作为username,账户密码作为password
    

    上传完成之后,仓库就会多出以下文件

    然后哦选择gitee pages 网页解析服务

    然后选择开启 或 更新即可。注意需要绑定手机号,否则不允许使用pages服务。然后访问网址
    这里需要注意,每次重新上传网页后,都需要到这里来更新网页

    解决hexo博客网页无法使用图片问题

    npm install hexo-asset-image --save	# 安装hexo插件
    
    # 这里还要注意修改_config.yml中的一个点
    ……
    post_asset_folder: true
    ……
    
    hexo new test		# 生成新的网页
    

    位置在 test/source/_posts下,会同时生成test目录和test.md 网页,将需要的图片放置到test目录下,test.md就可以正常解析了,注意:要在图片路径直接写成同目录下即可。

    本文经「原本」原创认证,作者乾坤盘,访问yuanben.io查询【3SCNT0GH】获取授权信息。

  • 相关阅读:
    wxWidgets中wxDateTime与wxString的互操作
    wxWidgets文件操作(六)
    wxWidgets文件操作(三)wxFileDialog与wxTextCtrl
    终于完成词频统计小程序~
    我的第一个c#工程~
    Word frequency program的进展
    List Find和BinarySearch性能比较
    堆和栈
    Java工程师初学Android(四)(转)
    Java中static、this、super、final用法(转http://chytmaths.blog.163.com/blog/static/29482972200610125744333/)
  • 原文地址:https://www.cnblogs.com/somata/p/GiteeAndHexoBuildPersonalBlog.html
Copyright © 2011-2022 走看看