又一个Win10安装hexo及主题的记录

网上这样的垃圾帖子估计没上万，但上千总有的吧，为什么我又搞一篇出来？

这个问题问的好，其他写类似主题的人中有不少也应该想过这个问题，最终还是决定要写自己的一篇。除了专门为了生产垃圾信息的AI人以外，剩下的，应该都是遇到了”奇怪的问题”，最终觉得还是有必要写出来记录下。

这种想法在我过去六年接触Linux开始，体会是越来越深。Linux开源的系统赋予程序员么近乎无限的自由，但无助于解决碎片化的问题。特别是当涉及缺乏利益驱动的免费开源程序时，当“爱”用尽时，自然留下了烂摊子。

即使不是烂摊子，那些相互之间的依赖，嵌套着的程序，对于最终使用者来说，在不同的环境下，还是会遇到开发者们感觉“匪夷所思”的问题。

怎么办？

写到这里再想想，可能所有教程都会遇到上边的问题吧，只是在Linux这个平台上，这这样的情况相对突出一些罢了。

根本原因在于这种比较复杂麻烦的事，必须做，但不需要经常做，但只做一次最终肯定会忘，而忘记了必然有一天需要还的，怎么办？写个教程教未来的自己吧！着重记录原理，提及踩的坑，下次可以立即上手就好。

本着这样的精神，以下开始教程啦：

1. hexo的运行基础

hexo作为一个JS程序，想跑起来，根据官网，至少需要Node.js和Git，下载安装即可，我用的LTS版本。Node.js安装时还会安装chocolatey，记得机器科学上网，当然，即使科学了，用时也很长。为了节省时间，装好了赶紧蹭蹭首富的光吧。

切换npm镜像地址的程序：

npm --registry https://registry.npm.taobao.org install node-red-contrib-composer@latest #临时使用淘宝源

npm config set registry https://registry.npm.taobao.org #全局配置切换到淘宝源

# npm config set registry http://www.npmjs.org #全局配置切换到官方源

npm info hexo-cli #检测是否切换到了淘宝源

如果安装过程中没有选择windows组件，那么安装node.js后可以在管理员权限下的PowerShell中输入npm install -g windows-build-tools

也可以自己安装，相关教程

2. 安装hexo

使用Node.js的包管理器安装

npm install -g hexo-cli

注意！是hexo-cli，不是hexo！！

-g这个扩展表示把hexo安装成为全局程序，使命令行全局可用hexo命令。用-S则不能，另外powershell不行，用cmd吧。此时hexo是安装在全局预设目录下，而不是当前的项目文件夹下。

此外，相应的还有如下几种选择：

npm install X -g
安装模块到全局，不会在项目node_modules目录中保存模块包。
不会将模块依赖写入devDependencies或dependencies 节点。
运行 npm install 初始化项目时不会下载模块。
具体想知道装在哪里，可以npm config ls，安装完成后也会显示位置。

npm install X
会把X包安装到node_modules目录中
不会修改package.json
之后运行npm install命令时，不会自动安装X

npm install X --save  同  npm install X -S
会把X包安装到node_modules目录中
会在package.json的dependencies属性下添加X
之后运行npm install命令时，会自动安装X到node_modules目录中
之后运行npm install --production或者注明NODE_ENV变量值为production时，会自动安装msbuild到node_modules目录中,即是在线上环境运行时会将包安装

npm install X –save-dev  同  npm install X -D
会把X包安装到node_modules目录中
会在package.json的devDependencies属性下添加X
之后运行npm install命令时，会自动安装X到node_modules目录中
之后运行npm install –production或者注明NODE_ENV变量值为production时，不会自动安装X到node_modules目录中

使用原则:
devDependencies 节点下的模块是我们在开发时需要用的，比如项目中使用的 gulp ，压缩css、js的模块。这些模块在我们的项目部署后是不需要的，所以我们可以使用--save-dev的形式安装。像 express 这些模块是项目运行必备的，应该安装在 dependencies 节点下，所以我们应该使用--save的形式安装。

总结为一句话：运行时需要用到的包使用––save，否则使用––save-dev。

作者：JuanitaLee
链接：https://www.jianshu.com/p/920c1a6e999c
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

3. 初始化hexo

hexo init <folder> # 创建网站目录，并从github上pull模板下来
cd <folder>
npm install # 根据模板的package，安装各种模块

安装好后，会提示你xx packages are looking for funding。这里没有其他意思，真的是字面上的意思，有xx个包的开发者正在寻求资金支持，输入npm fund就可找到详细的链接了，如果有意愿和余力，当然是鼓励支持呀！

如果不想看到这段话。。。就运行npm install --no-fund

4. 安装主题

npm install -S hexo-theme-next@latest # 安装next主题
# npm install -S hexo-theme-icarus # 安装icarus主题

创建_config.icarus.yml和_config.next.yml配置文件

_config.yml是站点设置，_config.xx.yml是对应的主题设置。

5. 建立tags、categories、404页面

Next主题设置页面中明确提示了：

Except home and archives, all custom pages under menu section need to be created manually. See «Custom Page Support».

hexo new page 404
hexo new page tags
hexo new page categories
hexo new page about

6.换gitignore

# Hexo init
db.json
node_modules/
public/
.deploy*/

# General
.DS_Store
.AppleDouble
.LSOverride

# Thumbnails
._*

# Files that might appear in the root of a volume
.DocumentRevisions-V100
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
.VolumeIcon.icns
.com.apple.timemachine.donotpresent

# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk

# Windows thumbnail cache files
Thumbs.db
ehthumbs.db
ehthumbs_vista.db

# Dump file
*.stackdump

# Folder config file
Desktop.ini

# Recycle Bin used on file shares
$RECYCLE.BIN/

# Windows Installer files
*.cab
*.msi
*.msm
*.msp

# Windows shortcuts
*.lnk

*~

# temporary files which can be created if a process still has a handle open of a deleted file
.fuse_hidden*

# KDE directory preferences
.directory

# Linux trash folder which might appear on any partition or disk
.Trash-*

# .nfs files are created when an open file is removed but is still being accessed
.nfs*

# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# Runtime data
pids
*.pid
*.seed
*.pid.lock

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# nyc test coverage
.nyc_output

# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# Bower dependency directory (https://bower.io/)
bower_components

# node-waf configuration
.lock-wscript

# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release

# Dependency directories
node_modules/
jspm_packages/

# Typescript v1 declaration files
typings/

# Optional npm cache directory
.npm

# Optional eslint cache
.eslintcache

# Optional REPL history
.node_repl_history

# Output of 'npm pack'
*.tgz

# Yarn Integrity file
.yarn-integrity

# dotenv environment variables file
.env


.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json


*.gem
*.rbc
/.config
/coverage/
/InstalledFiles
/pkg/
/spec/reports/
/spec/examples.txt
/test/tmp/
/test/version_tmp/
/tmp/

# Used by dotenv library to load environment variables.
# .env

## Specific to RubyMotion:
.dat*
.repl_history
build/
*.bridgesupport
build-iPhoneOS/
build-iPhoneSimulator/

## Specific to RubyMotion (use of CocoaPods):
#
# We recommend against adding the Pods directory to your .gitignore. However
# you should judge for yourself, the pros and cons are mentioned at:
# https://guides.cocoapods.org/using/using-cocoapods.html#should-i-check-the-pods-directory-into-source-control
#
# vendor/Pods/

## Documentation cache and generated files:
/.yardoc/
/_yardoc/
/doc/
/rdoc/

## Environment normalization:
/.bundle/
/vendor/bundle
/lib/bundler/man/

# for a library or gem, you might want to ignore these files since the code is
# intended to run in multiple environments; otherwise, check them in:
# Gemfile.lock
# .ruby-version
# .ruby-gemset

# unless supporting rvm < 1.11.0 or doing something fancy, ignore this:
.rvmrc

# jekyll
Gemfile.lock
package-lock.json
_site/
.sass-cache/
.jekyll-metadata

_drafts/

7.更新hexo及主题的nodejs程序

在项目文件夹下运行npm update -S即可。

安装npm install -g npm-check

然后运行npm-check检查哪些包需要更新

最后npm-check -u交互式升级包，升级后package.json也会同步更新。出了问题，就一个一个更新看看哪里有问题了。

其他可参考Hexo版本升级指南 | novnan’s notes

8. 部署

这里介绍两种部署到github的方式，还可以选择部署到vercel

8.1 hexo deployer

先要安装插件’npm install hexo-deployer-git –save’，然后在_config.yml中设置deploy的相关内容，具体参见。

---

2023.9.12更新

文档里举例的repo写法是https的，在此次更新中遇到的问题，github action编译后无法推送，提示could not read Username for 'https://github.com': No such file or directory。

我在本地使用hexo deploy时也是同样的问题，但多了一个提示，说使用用户名和密码的验证方式很早就禁止了。在为本地计算机配置git ssh，将repo地址改为ssh的写法后，一切顺利。

8.2 hexo-action

参考hexo-action，利用github action来将网页发布到github pages.

注意，不要使用GitHub账户的那个key，单独设置一个，而且添加时候也会提醒。。。偷不到懒的。。。

config里的deploy插件是必须的，另外注意9.1中提到的git地址的写法，也就是git@github.com:xxx

---

2023.9.12测试补充
npm更新到10.0以上时，sma11black的脚本使用的node版本太旧了，在marketplace里找到一个更新:

- name: Hexo Action with Nodejs 17
  uses: mark0smith/hexo-action@v0.0.3

用以上信息替换smallblack脚本中的uses内容即可。

8.3 vercel

直接在vercel的网站上配置即可。

项目settings里有选择node.js版本的选项，最近的更新在这里卡了好久，本地更新自己的nodejs没用的。。。

9. 阅读时长 ≈ NaN:aN

按照教程开启阅读时长及字数统计后，如果不显示正确信息，那么记得清除数据：

hexo clean

10. 开启hexo-word-counter中的post图标选项

hexo-word-counter插件说明中提到item_text_post选项，实际测试设置无效，且next-theme的配置说明里也没有这个选项。

找到了next-theme的telegram群，群内大佬指点，应该修改：

post_meta:
  item_text: false

11.hexo 文章创建时间与更新时间

在_config.yml下设置updated_option: 'date'

在_config.next.yml下设置：

post_meta:
  updated_at:
    enable: true
    another_day: true

然后在文章头中设置updated项，以此防止文件修改时间干扰最终显示。

12.powershell下使用hexo命令提示”此系统上禁止运行脚本”

Set-ExecutionPolicy RemoteSigned #此命令当时从哪里找的，忘了。。。

Set-ExecutionPolicy -ExecutionPolicy UNRESTRICTED #刚才搜了一下，现在网上都是这个了。。。还没有测试过。。。

13.停止目录自动编号

在’_config.next.yml’中修改toc下的number为false

Changelog

2023/09/12 增加了软件更新的方式，完善了部署部分。

2022/11/21 增加停止目录自动编号的方法

2022/11/11 安装hexo还是要带着-g的，不能带’-S’，否则hexo命令行不起作用

2022/11/09 此系统上禁止运行脚本