gitee实现个人存放网络资源图片集vue公测版
往期精彩文章:
1.前端如何通过vue/cli脚手架创建vue项目【vue工具】
2.如何使用csdn里的自定义模块管理专栏,看这一篇就够了。
4.盘点,这些年你知道的鼠标移入显示小手图标的css的cursor 属性,你还记得吗?
💌 作者简介
- 📖 个人介绍:小伙伴们,大家好!我是水香木鱼,【
前端动态图解领域创作者
】😜 - 📜 CSDN主页:水香木鱼
- 📑 个人博客【简历】:陈春波
- 🎨 系列专栏:工欲善其事必先利其器
- 🌹 一键四连:关注💋+点赞👍+收藏⭐+留言📝
- 📢 人生箴言:即使没有万全准备,也要勇敢迈出第一步。
哈喽小伙伴们,我们是否拥有自己的图床呢?有很多漂亮的自拍照,是否都存在手机里?从事IT行业,尤其是程序员,
图床是日常生活中,必备存图神器
。
如果你是前端开发工作者,请看这里👇 当然,学到手的知识,归根到底都是我们自己的。
文中如有不懂的地方,可以
在下方留言
,木鱼会在第一时间 给大家回复
。
注意:【这里的图床指的是个人所有、当作个人的相册集、blog 文章内的图片素材存储等,!!! 并非自动上传的图床】
1、图床介绍
图床就是专门用来存放图片,同时允许你把图片对外连接的网上空间【个人或者对外开放使用】
2、图床应用
- 相册集
- 个人博客【文章素材】
- 存放个人生活照等
3、创建图床准备工作
- 创建vue项目
- 选用纯前端开发【vue2、Ant Design of Vue、本地图片数据.js】
- 免费
开通Gitee Pages 服务
4、结合Vue的UI组件库,美化图床
- element
- Ant Design of Vue
5、案例【博主亲身体验】
由于项目属于脚手架创建,在这里就不进行详细分析了。请伙伴们 移步仓库 自行查看。一👇👇👇
可查看 👉图床源码下载地址 ,伙伴们拿去修改即可。
👆👆👆👆👆👆
如何使用csdn 自定义模块专栏 ?
请看如下: 往期精彩文章 👉如何使用csdn里的自定义模块管理专栏,看这一篇就够了。
6、Gitee Pages 服务部署【关键】
dist 结构
选择Gitee Pages 服务
并进入
以下为已经部署的截图样例,没有开通Gitee Pages 服务
的伙伴,一定要开通,才会显示此界面。
- 部署分类:master
- 部署目录:dist 【因为vue项目,必须通过打包后才可以部署项目,dist 为打包后的压缩版】
- 选择强制使用https 协议
- 点击更新
📖 写在最后
感谢大家阅读到结尾,本次的文章就分享到这里,总结了图床的经典案例,让我们都拥有属于自己的图床,希望可以帮到大家,谢谢。
如果您觉得这篇文章有帮助到您的的话不妨关注+点赞+收藏+评论+转发
支持一下哟~~😛您的支持就是我更新的最大动力。