小白也能行!10分鐘用Cursor搭建個人博客網站(零基礎教程)
一、Cursor是什么?
Cursor是一款基于AI的智能代碼編輯器,它整合了GPT-4技術,可以幫助我們:
? 自動生成代碼
? 解釋代碼含義
? 修復代碼錯誤
? 對話式編程指導
特別適合編程新手使用,傳統搭建博客需要掌握的HTML/CSS/命令行等知識,現在通過Cursor的AI對話都能輕松搞定!
(對比傳統VS Code的優勢:內置AI助手/智能補全/對話式編程)
二、準備工作
1、下載安裝Cursor:官網 https://cursor.sh(支持Win/Mac)

2.安裝Node.js:官網 https://nodejs.org(選LTS版本,安裝時記得勾選Add to PATH)
2.1、下載nodejs

2.2、安裝nodejs
2.2.1 自定義安裝路徑(可以選擇默認)

2.2.2 圖根據本身的需要進行,我選擇了默認Node.js runtime,然后Next:
Node.js runtime :表示運行環境
npm package manager:表示npm包管理器
online documentation shortcuts :在線文檔快捷方式
Add to PATH:添加到環境變量

不用勾選這一個,繼續Next,然后自定義安裝路徑,這里建議不要裝在C盤,直接把C:\Program Files\nodejs改成D:\Program Files\nodejs
然后再在安裝路徑的根目錄下新建兩個文件夾,node_cache和node_global,如圖所示:

2.2.3 環境配置
建好以后開始配置環境:右鍵此電腦——屬性——高級系統設置——高級——環境變量


在系統變量里新建一個NODE_HOME,變量值為安裝路徑:D:\Program Files\nodejs

然后再在系統變量的【path】中添加
%NODE_HOME%
%NODE_HOME%\node_global
%NODE_HOME%\node_cache
?

然后將用戶變量默認的C:\User\lenovo\AppDate\Roaming\npm改成: D:\Program Files\nodejs\node_global

到這一步,環境就已經完全配好了,現在開始查看。
2.2.4 查看
鍵盤Win+R進入cmd,然后依次輸入
【注意:此時是打開CMD窗口,并非在C:\Program Files\nodejs目錄下執行node.exe】
node -v
npm -v

像這樣會出現你安裝的版本號
默認狀況下,我們在執行npm install -g XXXX時,下載了一個全局包,這個包的默認存放路徑C:\Users\Administrator\AppData\Roaming\npm\node_modules下,能夠經過CMD指令npm root -g查看
然后在cmd中執行如下命令,配置緩存目錄和全局目錄
#設置緩存npm config set cache
"E:\Program Files\nodejs\node_cache"
#設置全局模塊
npm config set prefix "E:\Program Files\nodejs\node_global"


如果出現標紅報錯,是由于權限的原因,右擊Nodejs文件夾->屬性->安全,點擊編輯,將所有權限都 ?即可。
或者以 管理員身份運行 cmd。
5.更換npm源為淘寶鏡像
npm 默認的 registry ,也就是下載 npm 包時是從國外的服務器下載,國內很慢,一般都會指向淘寶 https://registry.npm.taobao.org。
在cmd里輸入
npm config set registry https://registry.npm.taobao.org/
檢查配置是否成功
npm config get registry

這樣就配置好了
配置完成后,安裝個module測試下,輸入npm install express -g,進行模塊的全局安裝:
由于版本的問題,淘寶的鏡像已經過時了,解決辦法:
先輸入pm config set strict-ssl false
最后:npm install cnpm@7.1.1 -g
至此,nodejs就安裝好了。
3、注冊GitHub賬號:https://github.com(用于免費部署)

三、搭建博客詳細步驟
1、打開cursor客戶端軟件

2、創建項目
在Cursor中按 Ctrl+N 新建終端,依次輸入:
mkdir myblog # 創建博客文件夾 cd myblog # 進入文件夾 npm install -g hexo-cli # 安裝Hexo框架 hexo init # 初始化博客 npm install # 安裝依賴
3、啟動本地服務器
繼續輸入:
hexo clean; hexo g; hexo s
注意:需要在當前根目錄myblog下
瀏覽器打開 http://localhost:4000 就能看到初始博客啦!

4、自定義博客(Cursor AI輔助)
4.1、修改配置:用Cursor打開 _config.yml 文件
修改title/description等基本信息
按Ctrl+K喚出AI,輸入"如何更換博客主題?"
?

4.2、安裝主題示例:
npm install hexo-theme-butterfly
在配置文件中修改:
theme: butterfly

5、部署到GitHub Pages
5.1、在GitHub新建倉庫,名稱為【你的用戶名.github.io】
5.2、安裝部署插件:
npm install hexo-deployer-git –save
5.3、修改配置:
deploy: type: git repo: https://github.com/你的用戶名/你的用戶名.github.io.git branch: main
5.4、執行部署:
hexo clean ; hexo deploy
四、效果展示
訪問 https://你的用戶名.github.io 就能看到線上博客啦!

默認包含:
- 文章發布功能
- 分類/標簽系統
- 響應式設計
- 主題自定義界面
五、溫馨提示
? 所有操作都可在Cursor終端完成
? 遇到問題隨時按 Ctrl+L 喚醒AI助手
? 推薦免費主題:Butterfly/Volantis/Material
? 修改配置后記得先hexo clean
如果你想要更好的體檢,可以看看以下建議:
- 綁定自定義域名(阿里云10元/年)
- 添加評論系統(Valine/Giscus)
- 配置SEO優化
- 接入Google Analytics
現在你已經擁有一個完全屬于自己的博客網站了!整個過程無需編寫任何復雜代碼,通過Cursor的AI輔助和簡單命令就能完成。趕快寫你的第一篇博客吧!

浙公網安備 33010602011771號