Hexo 部落格搭建

2021-09-24 07:53:55 字數 2959 閱讀 1589

本站的部落格搭建採用hexo+next主題,部署在github pages

下面手把手帶你搭建免費高效的部落格系統~

hexo–快速、簡潔且高效的部落格框架,基於nodejs環境。

hexo使用markdown(或其他渲染引擎)解析文章,在幾秒內,即可利用靚麗的主題生成靜態網頁。

安裝前提:

git:windows | mac

安裝hexo:

npm install -g hexo-cli
具體的安裝過程的問題,這裡不再過多提及。官方安裝文件:

新建資料夾建立專案:

hexo init cd npm install
若需要在當前資料夾直接建立,在當前目錄下hexo init

hexo專案目錄結構:

.

├── _config.yml

├── package.json

├── scaffolds

├── source

| ├── _drafts

| └── _posts

└── themes

_config.yml:**的配置資訊。官方配置文件:configuration。

package.json:應用程式的資訊。

scaffolds模版資料夾。當您新建文章時,hexo 會根據scaffold來建立檔案。官方模板配置文件:templates

source資源資料夾是存放使用者資源的地方。除_posts資料夾之外,開頭命名為 _ (下劃線)的檔案 / 資料夾和隱藏的檔案將會被忽略。markdown 和 html 檔案會被解析並放到 public 資料夾,而其他檔案會被拷貝過去。

themes主題資料夾。hexo 會根據主題來生成靜態頁面。

專案下的`_config.yml`為**專案配置檔案**,主題下的`_config.yml`為**主題配置檔案**。

執行

hexo generate && hexo server --debug
即可在本地http://localhost:4000/ 檢視預設的**樣式啦~

hexo init [folder]
如果沒有設定 folder ,hexo 預設在目前的資料夾建立**。

hexo new [layout]
如果沒有設定layout的話,預設使用 **配置_config.yml中的default_layout引數代替。

如果標題包含空格的話,請使用引號括起來。

也可以簡寫:hexo n [layout]

hexo generate
也可以簡寫:hexo g

hexo server

也可以簡寫:hexo s

hexo deploy
也可以簡寫:hexo d

部署到github pages請看這篇文章~

hexo clean
清除快取檔案 (db.json) 和已生成的靜態檔案 (public)。

在某些情況(尤其是更換主題後),如果發現您對站點的更改無論如何也不生效,您可能需要執行該命令。

更改配置檔案_config.yml後需要執行該命令。不然可能會報unhandled rejection error: enoent: no such file or directory, open '**'

hexo的預設主題是landscape,官方推薦主題:

本部落格**使用的主題是next.pisces

如需要v6及以上的,請看新倉庫

先從git將主題拉下來,在專案下

git clone  themes/next
專案配置檔案_config.yml中查詢theme,修改值為theme: next。(注意next前的空格哦)

然後hexo clean && hexo generate && hexo server --debug就能看見next主題的預設樣式啦

選擇next.pisces需要在themes/next下的主題配置檔案_config.yml中查詢scheme,修改值為scheme: pisces再執行上面的重新啟動,

就能看到樣式啦

安裝hexo和next主題到此就結束啦~

建議在專案下package.json中配置開發執行指令碼和部署指令碼,在最外層json中新增:

"scripts"

:,

以後開發執行npm run dev就好啦。線上部署使用npm run start

hexo搭建部落格

有乙個github賬號,沒有的話去註冊乙個 安裝了node.js npm 安裝了git 新建乙個名為你的使用者名稱.github.io的倉庫,比如說,如果你的github使用者名稱是test,那麼你就新建test.github.io的倉庫 必須是你的使用者名稱,其它名稱無效 將來你的 訪問位址就是 ...

hexo部落格搭建

使用hexo搭建乙個部落格,並託管在github pages上的簡易教程。在github上建立乙個倉庫,名稱為.github.io npm install g hexo cli hexo init cdnpminstall hexo server在4000埠檢視效果 在 config.yml檔案中,...

hexo搭建個人部落格 使用Hexo搭建個人部落格

node.js 附帶npm git npm install hexo cli g g選項表示全域性安裝 global 即安裝到你的電腦中而非專案目錄中,建議新增,這樣在命令列就可以直接使用hexo命令。hexo init 目錄名稱 cd 目錄名稱 npm i 官方文件已經完整說明了每個配置項的作用,...