zoukankan      html  css  js  c++  java
  • [BLOG] Hexo之NexT配置过程中遇到的问题

    写在前面

    从搭建到布置到GitHub花费时间大概用了五个小时,中间删除repo N次,localhost运行正常,git上出现过404页面、若干次README.md页面,本文将简略介绍搭建过程,主要内容是搭建过程中出现的问题解决方法。
    https://hexo.io/zh-cn/docs/ hexo官方文档
    https://c-axis.github.io/ 博客地址

    环境配置

    安装Git,注册GitHub,并创建博客的repository
      具体过程自行百度(注意点:repository的名称必须是 Name.GitHub.io)
    安装Node https://nodejs.org/zh-cn/download/
      下载了之后一直点就行了
    安装hexo
      创建一个文件夹hexo,存放hexo的配置文件,右键Git Bush Here执行下面的代码

    npm install hexo-cli -g 
    npm install hexo --save 
    hexo -v  # 查看是否安装成功

    初始化仓库

    $ hexo init yourname.github.io #建议和创建仓库时使用同一个 这里使用的不是GitHub上已经建好的那一个,而是在本地初始化的一个文件夹,如果已经建好的话,请删除后在使用初始化命令
    npm install
    npm -v #查看npm版本
    
    hexo g   # 使用默认主题本地测试下
    hexo s

    之后顺利的画就可以在本地 http://localhost:4000 进行预览了
    此时文件夹的目录如下:

    .
    ├── _config.yml
    ├── package.json
    ├── scaffolds
    ├── source
    |   ├── _drafts
    |   └── _posts
    └── themes

    具体内容不做介绍有问题咨询度娘或者Google,这里离上传GitHub就不远了。
    修改这里的_config.yml文件

    deploy:
        type: git
        repo: https://github.com/yourname/yourname.github.io.git
        branch: master


    写博客与发布
     

    经过上述步骤,本地博客已经完成,那么接下来就是写博客了。

    你的博客文件需要存放到 xxx.github.io/source/_posts 文件夹中,在该文件夹下面你可以按照你的博客分类建立一系列的文件夹来管理博客原文件。

    1、在本地运行测试

    hexo s


    2、安装上传Git功能:
    在浏览器中输入 http://localhost:4000 访问本地博客

    npm install hexo-deployer-git --save

    3、清理缓存并发布常见问题

    hexo clean #清理缓存 多数页面没有更新的时候都可以用这个东西多刷新几次
    hexo g     #生成页面
    hexo d     #Git上传
    如果是第一次部署,终端会提示要求输入用户名和密码。这里不推荐git push,新手容易同时操作两种上传,版本更不好管理,Git的使用仅仅使用下载和弄坏了后重新布置。等命令执行完之后,过几分钟打开 http://yourname.github.io 即可看到你的个人博客了。以后要发布新文章,执行上述命令即可。
    • Git上显示为404页面,这里大部分原因应该Git的错误,等待或者重新创建repository(捂脸)。
    • 本地查看博客正常但是yourname.git.io查看时为空或者是README.md的样式。重新查看_config.yml文件的delpoy下的设置,确定无误后进行 hexo clean多刷新几次,重新上传,等几分钟再看。

    写在最后

      官方文档是个好东西,出现问题时最好先去看看官方有没有列出,然后就在问人,我的大部分问题出在布置好本地,上传git的过程中,有些BUG这里没有列出,之后再补吧。

  • 相关阅读:
    webpack 打包性能分析工具
    npm 使用
    npm 构建时,次要版本变化引起的问题
    AtomicStampedReference、AtomicMarkableReference 区别
    vue-cli 中的静态资源处理
    vue-cli 构建项目中 config/index.js 文件解读
    webpack的3个路径配置项: assetsRoot、assetsSubDirectory、assetsPublicPath
    Vue2 dist 目录下各个文件的区别
    DllPlugin、DllReferencePlugin 可以提取的第三方库列表
    JUC集合之 CopyOnWriteArrayList
  • 原文地址:https://www.cnblogs.com/xianeri/p/10090432.html
Copyright © 2011-2022 走看看