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

    hexo 是一款快速、简单、并且强大的博客博客模板框架 - 基于nodejs 。

    特点

    • 基于nodejs
    • 使用Markdown书写文章
    • 无需数据库
    • 可以使用GitHub Pages发布

    要用到的模块

    • node.js
    • hexo
    • git
    • 多说

    git需要提前安装,hexo init的时候用到。

    安装Nodejs

    下载地址: http://nodejs.org/download/

    验证node和npm是否安装成功(由于新版的NodeJS已经集成了npm),在cmd中输入

    node -v
    npm -v
    

    出现版本号就是正确安装了。

    安装hexo

    安装hexo,-g表示全局安装。

    npm install -g hexo
    

    如果有warn可以不用管。

    初始化一个博客

    选择一个常用的目录(不要有中文或者空格),初始化一个博客应用:

    hexo init
    

    文件夹自动生成建网站所需的文件。

    cd blog
    npm install
    

    会在文件夹下安装node_modules依赖。

    本地测试

    hexo server
    

    然后就可以http://localhost:4000/ 中打开了
    记得关server是ctrl+c

    此时文件目录为:

    .deploy_git
    node_modules    nodejs 相关依赖
    public 自动生成的静态html目录
    scaffolds 脚手架 - 也就是一个工具模板
    source 存放markdown文章目录
    themes  存放皮肤的地方
    _config.yml 配置文件
    CNAME github域名绑定文件
    db.json 数据
    package.json    配置依赖
    

    新建文章

    在blog根目录下我们可以通过 hexo new <title> 命令来实现新建文章。

    例如我们想新建一篇主题为hello的blog:

    hexo new hello
    

    hexo会在 source/_posts/ 下新建hello.md 文件。

    编辑 hello.md 就是编辑你的blog内容了 — markdown语法

    hello.md 的文档和目录可以这样添加:

    title: hexo、github、多说、搭建免费博客
    date: 2014-10-19 12:56:58
    tags:
    - tag1
    - tag2
    - tag3
    categories:
    - 目录
    ---
    
    // 你的内容
    <!--more--> // 以上为摘要
    

    我们也可以手动在source/_posts/ 下新建md 文件。

    更换主题

    主题目录:themes/
    在此目录放置主题,并在根目录的_config.yml更改

    theme: landscape 
    

    即可。

    部署到github

    初步准备
    安装git :
    下载地址:http://msysgit.github.io/

    github上创建账号
    去https://github.com/注册账号,并建立repository
    建立仓库名必须是XXX.github.io。每个用户可以建立一个与用户名一致的XXX.github.io特殊仓库。

    部署
    部署到github 非常简单。因为hexo已经为你集成好了发布到github的配置。

    我们只需要 修改 blog 目录下的 _config.yml 文件。

    打开 _config.yml 找到如下配置:

    # 部署配置
    deploy:
      type: git
      repo: git@github.com:xxx/xxx.github.io.git
      branch: master
    

    回到 blog 目录 执行

    hexo g
    hexo d
    

    你会发现public 目录下的页面已经发布到github gh-pages 分支了。往后我们要做的就是用自己的域名指向 github。

    设置独立域名

    默认的域名是xxx.github.io。自己如果有域名,可以绑定。

    例如 我的域名为 blog.me

    1 我们要在github blog项目下新建一个CNAME文件 内容为 blog.me
    2 将我们得域名A 记录到 207.97.227.245 这个ip

    域名解析完成后我们 blog.me 就是我们的blog了。支持子域名。207.97.227.245为github指定绑定的域名。

    插件安装

    多说

    评论插件多说为hexo量身打造了一套解决方案。
    查看教程
    站点创建地址

    rss

    rss的安装非常简单 ,已经有人做好了插件,安装只需一步。

    npm install hexo-generator-feed
    

    启动服务器,用浏览器打开 http://localhost:4000/atom.xml, 就可以看到RSS已经生效了。

    sitemap

    同样是一条命令,就可以完成。

    npm install hexo-generator-sitemap
    

    启动服务器,用浏览器打开 用浏览器打开 http://localhost:4000/sitemap.xml 发现site已经生效。

    命令概览

    清除缓存,解决很多奇怪问题

    hexo clean
    

    hexo安装升级

    npm install hexo -g #安装  
    npm update hexo -g #升级  
    hexo init #初始化
    

    简写

    hexo n "我的博客" == hexo new "我的博客" #新建文章
    hexo p == hexo publish
    hexo g == hexo generate#生成
    hexo s == hexo server #启动服务预览
    hexo d == hexo deploy#部署
    

    服务器

    hexo server #Hexo 会监视文件变动并自动更新,您无须重启服务器。
    hexo server -s #静态模式
    hexo server -p 5000 #更改端口
    hexo server -i 192.168.1.1 #自定义 IP
    
    hexo clean #清除缓存 网页正常情况下可以忽略此条命令
    hexo g #生成静态网页
    hexo d #开始部署
    

    监视文件变动

    hexo generate #使用 Hexo 生成静态文件快速而且简单
    hexo generate --watch #监视文件变动
    

    平时发布文章

    hexo g
    hexo d
    

    配置参考

    配置文件使用#注释,注意有空格。

    根目录_config.yml配置:

    # Hexo Configuration
    ## Docs: http://hexo.io/docs/configuration.html
    ## Source: https://github.com/hexojs/hexo/
    ## 空一格
    
    # Site
    title: 飞鸿影~的blog
    subtitle: 
    description: 开拓不止,路才无尽。
    author: 飞鸿影
    email: 
    language: zh-CN
    timezone: 
    
    # URL
    ## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
    url: 'http://52fhy.github.io/'
    root: /
    permalink: :year/:month/:day/:title/
    # permalink: archives/:id/
    permalink_defaults:
    
    # Directory
    source_dir: source
    public_dir: public
    tag_dir: tags
    archive_dir: archives
    category_dir: categories
    code_dir: downloads/code
    i18n_dir: :lang
    skip_render:
    
    # Writing
    new_post_name: :title.md # File name of new posts
    default_layout: post
    titlecase: false # Transform title into titlecase
    external_link: true # Open external links in new tab
    filename_case: 0
    render_drafts: false
    post_asset_folder: false
    relative_link: false
    future: true
    highlight:
      enable: true
      line_number: true
      auto_detect: true
      tab_replace:
    
    # Category & Tag
    default_category: uncategorized
    category_map:
    tag_map:
    
    # 归档设置
    ## 2: Enable pagination
    ## 1: Disable pagination
    ## 0: Fully Disable
    archive: 1
    category: 2
    tag: 2
    
    # 服务器设置
    ## Hexo uses Connect as a server
    ## You can customize the logger format as defined in
    ## http://www.senchalabs.org/connect/logger.html
    port: 4000
    ## server_ip: 0.0.0.0
    logger: false
    logger_format:
    
    # Date / Time format
    ## Hexo uses Moment.js to parse and display date
    ## You can customize the date format as defined in
    ## http://momentjs.com/docs/#/displaying/format/
    date_format: YYYY-MM-DD
    time_format: HH:mm:ss
    
    # Pagination
    ## Set per_page to 0 to disable pagination
    per_page: 10
    pagination_dir: page
    
    # 插件和皮肤
    ## Plugins: https://github.com/tommy351/hexo/wiki/Plugins
    ## Themes: https://github.com/tommy351/hexo/wiki/Themes
    theme: yilia  ## landscape,yilia,pacman,coney
    exclude_generator:
    
    # RSS
    rss: /atom.xml #rss地址  默认即可
    
    # Markdown语法
    ## https://github.com/chjj/marked
    markdown:
      gfm: true
      pedantic: false
      sanitize: false
      tables: true
      breaks: true
      smartLists: true
      smartypants: true
    
    # CSS的stylus格式
    stylus:
      compress: false
    
    
    # Deployment
    ## Docs: http://hexo.io/docs/deployment.html
    
    # 部署配置
    deploy:
      type: git
      repo: git@github.com:xxx/xxx.github.io.git
      branch: master
    
    # 评论
    ## disqus_shortname:
    duoshuo_shortname: fhyblog
    

    主题目录下也有个配置,大家根据作者说明进行配置。

    参考

    1、hexo + github + 多说 来搭建免费博客 // Netpi 日志
    http://blog.netpi.me/实用/hexo/
    2、使用hexo和Github上创建自己的博客_其它_其它语言-ITnose
    http://www.itnose.net/detail/6231502.html
    3、hexo常用命令笔记 - SegmentFault
    http://segmentfault.com/a/1190000002632530

  • 相关阅读:
    分享上大学时CCTV5经常播放的一段宣传片
    嗯, 在Vista下面post一篇, 快过年的二三事
    [转自天涯]很多年以前,我是一个中锋
    关于Anthem的Button控件, 为啥仍然会PostBack?
    小白三下杭州
    搜狗, 谷歌, 紫光, 3大输入法互打结果.
    2008春节回家流水账
    早上拍的雪景.
    如果安装.net framework 3.5出错, 可以这样解决
    我那幸福的坐车偶记...
  • 原文地址:https://www.cnblogs.com/52fhy/p/5247430.html
Copyright © 2011-2022 走看看