Fr Cover Banner V2.0开源下载 一款插画资源下载网站

谢谢你没有找我,所以我找到你了

Fr Cover Banner V2.0开源下载 一款插画资源下载网站

介绍

Fr Cover 它是提供了枫瑞博客网软文发布的Banner图片下载,1.0版本使用Bootstrap 5写的。纯粹的Html Css上手简单,最好的是兼容电脑/平板/手机等多种尺寸,1.0下载可以前往《免版权,免商用插画Banner封面图片下载

2.0版本使用Vue 2.0 + Element UI写的,上手难度大大增加。而2.0版本是学习Pc Vue端框架第一个学习项目,加上不会vue更是头疼

感谢

夏天,codecczen,焦文松

预览图

Fr Cover Banner V2.0开源下载 一款插画资源下载网站
Fr Cover Banner V2.0开源下载 一款插画资源下载网站

完整安装

因为枫瑞也是新手,若有vue和前端基础建议使用完整安装

1.安装node:Node.js (nodejs.org)

2.安装全局vue-cli

克隆码云项目

https://gitee.com/fengruiblog/banner-v2.0

将源码倒入Hbulder/VS Code等工具,执行

vue ui
Fr Cover Banner V2.0开源下载 一款插画资源下载网站

在打开的地址中任务一栏即可以编译和运行项目

Fr Cover Banner V2.0开源下载 一款插画资源下载网站

源码中src/components/api.js中会请求3个json文件,网页的数据全部来自于他们,若打包发行在api.js中修改相对应域名即可,若在运行模式下可以使用淘宝的rap2 ap模拟工具测试,不如运行模式下会有跨域问题

Fr Cover Banner V2.0开源下载 一款插画资源下载网站

打包之后将源码中src/assets/frDataJson中会有有4个json文件夹,,若您将该文件复制到项目根目录,就是和api.js文件夹里面的路径相对应

打包安装

提供编译好的源码,拖入到编辑器(Hbulder/VS Code)中多文件查询api.里面的域名搜索替换即可

Fr Cover Banner V2.0开源下载 一款插画资源下载网站

如何更新

因为我们json数据和页面是分开的,这样我们后期更不会有太大的冲突

完整安装:下拉克隆的项目,重新编译即可

打包安装:下载编译好了源码,直接上传服务器替换即可

若有更新json文件,则需要手动更新json文件,之后在执行页面源码替换

踩坑

打包编译好的源码是无法直接使用的,需要放到服务器上,或者本地webSever运行

视频教程

https://www.bilibili.com/video/BV1S3411475D/

插画网

https://banner.frbkw.com/

编译好的文件下载

在公众号中回复“frcover”即可下载

Fr Cover Banner V2.0开源下载 一款插画资源下载网站 1
(7)
上一篇 12/01/2021
下一篇 12/09/2021

相关推荐

发表评论

您的电子邮箱地址不会被公开。

评论列表(9条)