基于Vue, Vuex 和 ElementUI 构建轻量单页Hexo主题Lite

最新推荐文章于 2022-04-21 22:00:16 发布
最新推荐文章于 2022-04-21 22:00:16 发布
阅读量872 收藏 1
点赞数
文章标签： javascript ViewUI
原文链接：https://segmentfault.com/a/1190000012513873
版权

Hexo Theme Lite

Keep Calm, Lite and Writing.

light single page blog application theme, using Vue, Vuex, ElementUI and so on.

一款轻量单页博客主题，基于Vue, Vuex 和 ElementUI 构建, 工具语言 Typescript

Live Demo

Demo | 在线演示

Github

项目地址

Preview

clipboard.png

Dev

全程typescript + vue component整体代码思路非常的清晰。

Features

支持

  • 自定义头像、背景
  • 自定义高斯模糊，效果如下：

clipboard.png

  • 评论系统
  • 谷歌分析
weixin_34049032
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
基于elementUI和vue做的简单界面
weixin_44395052的博客
08-08 585
今天学习了elementUI和vue，做了一个简单的学生列表界面。 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>界面案例</title> <link rel="stylesheet" href="../element-ui/lib/theme-chalk/index.css"> &lt
Vexo是一个Hexo主题模仿Vue的官方网站
08-08
Vexo是一个Hexo主题模仿Vue的官方网站
A hexo theme inspired by vuejs.org 搭建了个博客
justhacker的专栏
03-19 1313
嗨！很高兴你能来我的技术博客。现在它有一个在线网页版本了 http://blog.edagarli.com (https://github.com/edagarli/edagarli.github.io )这里存放了我放在博客上的文章，主要用于归档。现在，GitHub 已经成为了我日常开发中最常用的工具，我基本每天都会浏览下Github。如果有更迫切的事务需要联系，可以发送邮件到这个地址：lizh
:rainbow:‍:rainbow:未来派极光Hexo主题。-Vue.js开发
05-27
Aurora是使用Aurora颜色和UI元素的下一代主题。 它给您平滑的色彩流动感和未来感。 He‍:rainbow: Hexo主题极光:rainbow_flag: Hexo的未来派极光主题预览| 变更记录| 文件预览| 更变日志| 使用文档Aurora是使用Aurora颜色和UI元素的下一代主题。 它给您平滑的色彩流动感和未来感。 从1.1.0+版本开始，可以使用NPM或Yarn安装此主题，请查看用法文档以获取更多详细信息。 :sports_medal:我的赞助商（咖啡供应商）让我继续从事这个项目:blue_heart:单击此处查看ho
[Hexo]主题开发
lazyboy's blog
03-14 783
归档按照创建年份分类 <h2><%= __('archives') %></h2> <% var last; %> <% site.posts.sort('date', -1).each(function(post){ %> <% var year = post.date.year(); %> <% if (las
ex Vexo是受Vue官方网站启发的Hexo主题。-JavaScript开发
05-26
Vexo = Vue.js样式+ Hexo Vexo是受Vue.js官方网站启发的Hexo主题。 简介演示实时示例功能全面响应的百度分析Youyan Gitment分享Q Vexo = Vue.js风格+ Hexo Vexo是受Vue.js官方网站启发的Hexo主题。 简介演示实时示例功能完全响应的百度Analytics（分析）Youyan Gitment分享Qrcode SEO身临其境的状态栏文章目录安装下载/签出该主题到您的项目中cd your-hexo-folder git clone https://github.com/yanm1ng/hexo-theme- vexo.git主题/ vexo cp -R主题/ vexo / _source / *源/更新项目_config.yml主题配置，看起来像这样的主题：vexo这里
基于vue、vuex、ElementUI的后台管理系统源码.zip
07-06
Vue.js，一个轻量级的前端JavaScript框架，以其易学易用、高性能和组件化的特点在Web开发领域受到广泛欢迎。Vue的核心库专注于视图层，易于集成到现有项目中，同时也适合构建复杂的单页应用（SPA）。Vue的生态系统...
基于vue2.x和ElementUI插件的ui项目源码.zip
09-27
基于vue2.x和ElementUI插件的ui项目源码.zip基于vue2.x和ElementUI插件的ui项目源码.zip基于vue2.x和ElementUI插件的ui项目源码.zip基于vue2.x和ElementUI插件的ui项目源码.zip基于vue2.x和ElementUI插件的ui项目...
vue-cms：基于Vue和ElementUI构建的一个企业级后台管理系统
02-06
基于Vue和ElementUI构建的企业级后台管理项目预览在线体验： ://git.io/fp9UM简介vue-cms是一个企业级管理后​​台项目，基于Vue和ElementUI构建。它使用了最新的前端技术栈，内置了i18n国际化解决方案，支持多语言...
基于Vue和ElementUI的文化公司企业网站PC端设计源码
最新发布
03-28
一个使用Vue和ElementUI构建的文化公司企业网站PC端设计源码，包含Nodejs、Vue、JavaScript、CSS、HTML等编程语言。项目文件共72个，包括42个Vue文件、16个JavaScript文件、2个JSON文件、2个ICO文件、1个...
hexo-theme-bubuzou:一个仿Vue官网风格的hexo主题 https
05-01
更新日志 2021-4-4 主题更变-暗色系 文章页目录支持3级 2020-11-06 加载优化 文章页目录插件重写 2020-08-13 文章页目录栏bug修复 2019-03-29 文章页的右侧去掉“分类归档”、“标签云”和“最新文章”，右侧整块为文章目录 文章评论系统和访问统计改成基于 leancloud 的 valine 手机端头部菜单精简 手机端去掉右侧导航栏 2017-07-21 bubuzou.css 规范化了css文件 2017-07-12 评论系统由网易云跟帖改成了畅言 2017-06-25 增加了文章访问次数的统计功能 2017-06-07 文章目录优化，能够自适应定位 说明 hexo-theme-bubuzou主题是根据hexo里Apollo主题改编而来的， 安装 想要把hexo的主题应用到自己的博客上，需要在本地先构建好hexo所依赖的环境。 大致的步骤是这样的：
vueBootstrap-darkmode-toggle-temp：使用VueBootstrap设置样式的Vue应用程序，以及使用vuex的深色模式主题切换和内置的引导样式
02-19
Vue可切换引导 目标：创建一种简单的方法来更改Bootstrap产品组合，使其在运行时具有深色模式的功能（无需使用Vuetify或其他程序包） 方法： 使用Vuex处理自举颜色更改/变体更改，并将变量传递到整个应用程序中。 在App.Vue中使用.light和.dark类，可以使用样式为每个变量存储2种颜色，并使用javascript方法进行切换。 附加：可以通过创建引导程序自定义主题或变体并使用上述方法来调用它来创建更多选项。 项目设置 npm install 编译和热重装以进行开发 npm run serve 编译并最小化生产 npm run build 整理和修复文件 npm run lint 自定义配置 请参阅。 vueBootstrap-darkmode-toggle-temp
hexo-blog-admin:一个基于vue-admin-template的hexo博客后台管理，项目采用SpringBoot+Vue开发
05-13
Hexo Blog Admin 一个基于的hexo博客后台管理。包含了文章管理，文章发布，评论管理，用户管理等功能。 截图 技术栈 前端 Vue Vue-cli 3 vue-router ElementUI axios ...... 后端 JDK 11 SpringBoot MyBatis MySQL 8 构建 克隆项目 git clone https://github.com/yiyingcanfeng/hexo-blog-admin.git 前端构建 构建 # 进入项目目录 cd web # 安装依赖 npm install # 启动服务 npm run dev 浏览器访问 http://localhost:9527 发布 # 构建测试环境 npm run build:stage # 构建生产环境 npm run build:prod 其它 # 预览发布环境效果 npm run pr
Hexo 主题 Amber 开发与使用指南
weixin_34290390的博客
12-20 634
本文同步发布在 Easy Hexo
《Hexo: 从零开始编写自己的主题》3. 优化样式，设计自己的主题
Smileyan's blog
04-21 9117
3. 优化样式，设计自己的主题 3.1 概述 第2章完成了hexo的功能实现，虽然非常非常丑，但是可以保证的是该有的功能全部都实现了一遍，这个章节我们开始设计并开发自己的主题。 首先需要参考（复制粘贴）一些已有的模板代码，这些代码不要太多，不能太复杂，只要一个简单的界面就行。 3.2 选择自己熟悉的 UI 框架 现在有很多开源框架，我们使用这些开源框架来实现自己的功能，节省开发成本。 最好选择自己熟悉的框架，以及简单可用的框架。 比如 bootstrap，pure.css 等。 这里我选择的是 bootst
VuePress oneN 博客主题搭建 —— vuepress-theme-onen
Veminem的博客
10-19 2637
VuePress oneN 主题搭建简介预览主题安装主题配置首页侧边栏导航栏音乐控件页脚自定义图标自定义颜色MarkDown 扩展元信息一级标题参考选项 简介 一个偏文档风格的博客，灵感来自于 oneNote 笔记本 博客主题追求简约文档风，抛去主流博客的元素，标签、归档等 这看起来更像是对默认主题的一次改版，但也增加了主题的元素 预览 ???? Live Demo 主题安装 oneN 主题基于 ...
vuex的使用及vuex状态管理实现网页的主题切换（css）
qq_37288563的博客
04-23 616
vuex的使用及vuex状态管理实现网页的主题切换（css） 0. vuex的安装 npm install vuex 1. vuex的概念及作用 概念：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 上面只是简单的vuex的概念，当你需要在vue项目中维护一个“全局变量”的时候，你就可以用vuex来实现，所有的组件都可以访问到该“全局变量"，并且该”全局变量“的改变也会被所有组件监听到。 2.
vue 入门 之 安装vue 环境
weixin_44460201的博客
11-04 131
1. 下载 node.js http://nodejs.cn/download/ 点 next 完成安装； 输入 node -v 检测 node 版本及是否安装成功； 输入 npm -v 检测 npm 版本； 2. 安装淘宝镜像 cnpm https://npm.taobao.org/ 输入 $ npm install -g cnpm --registry=https://reg...
007 - VUE + hexo blog
qq_30856231的博客
08-10 1492
############ VUE.JS ########## 在【设置】中 file types 选中html后手动添加： *.vue ###网址： cn.vuejs.org 模板语法 API 指令 全局API methods computed watch 注意，不要在实例属性或者回调函数中（如 vm.$watch('a', newVal => thi
Vue + Vuex + ElementUI
05-09
这是一种前端开发的技术栈，Vue是一种流行的JavaScript框架，用于构建用户界面，Vuex是Vue的状态管理库，用于管理应用程序的状态，ElementUI是一个基于Vue.js的UI框架，提供了一系列的组件和样式，可以快速搭建出...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值