WP-VUE是一款基于Vue.js開發(fā)的WordPress前后端分離博客主題，由開發(fā)者自學(xué)Vue后獨(dú)立完成。主題采用nodejs、axios、element-ui等技術(shù)棧，具有文章收藏、點(diǎn)贊、自動(dòng)加載等功能。目前版本部署復(fù)雜，不支持SEO優(yōu)化，推薦嘗鮮體驗(yàn)。安裝需熟悉vue-cli和npm，包含WordPress文件和vue文件兩部分，需分別上傳和配置。主題免費(fèi)下載但問題解決需付費(fèi)，開發(fā)者提供了詳細(xì)的安裝說明和域名配置指南。
WP-VUE采用的是前后端分離設(shè)計(jì)，通過我自己寫的API實(shí)現(xiàn)前端快速響應(yīng)，這也是我寫的第一個(gè)vue版本的Wordpress主題，
- 主題介紹：詳情
從自學(xué)vue.js開始到這款Wordpress主題開發(fā)上線，其中的也是波折不斷，慶幸自己沒有放棄吧！首先看看截圖預(yù)覽
注意
此主題目前部署復(fù)雜，且無法進(jìn)行有利于SEO的操作，推薦嘗鮮體驗(yàn)
主題大致介紹
- 簡單的博客布局
- 包含登陸（暫未開發(fā)注冊與社交登陸）
- 用戶中心（設(shè)置功能暫未完善）
- 文章收藏、點(diǎn)贊、分享
- 觸底自動(dòng)加載下一頁
- 文章發(fā)布、審核（使用：mavon-editor編輯器）
- 后臺(tái)一鍵設(shè)置
- 首頁幻燈片
前端使用
- nodejs >= 6
- axios
- element-ui
- mavon-editor
- vue
- vuex
- vue-router
- qs
- nprogress
- ……
下載與安裝
wp-vue主題免費(fèi)開發(fā)下載使用，解決相關(guān)問題需付費(fèi)
安裝wp-vue主題首先確保你熟悉vue-cli與npm相關(guān)知識(shí)
1、下載主題文件包并解壓
2、將“Wordpress文件”文件夾里的主題上傳至Wordpress后臺(tái)
3、IDE中打開“vue文件”文件夾，并執(zhí)行相關(guān)操作
- 終端打開，cd到相關(guān)目錄
- 執(zhí)行：
npm install - 更改域名配置，打開
webpack.config.js，更改devServer下的API域名 - 打開
src/libs/axiosTool.js?并更改axios.defaults.baseURL默認(rèn)的請求地址 - 開發(fā)模式（本地調(diào)試使用）：
npm run dev - 生產(chǎn)模式：
npm run build，執(zhí)行后即可打包文件 - 打包完成后會(huì)生成一個(gè)
dist文件夾，將里面的所有內(nèi)容上傳即可
域名說明，你可以選擇后臺(tái)安裝一個(gè)域名，也可以安裝在一個(gè)域名下，安裝完成后需配置靜態(tài)規(guī)則
location / {
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
location /api {
proxy_pass https://yousite.com/api/v2;
}補(bǔ)充
此主題使用較為復(fù)雜，可留言，
