- 博客(75)
- 问答 (15)
- 收藏
- 关注
原创 Jenkins 自动化部署实战案例分享
我们后面会访问 centos 中的某些文件夹,默认 Jenkins 使用的用户是 jenkins,可能会没有访问权限,Jenkins 本身是依赖 Java 的,我安装了 Java17 的环境。编辑一下文件/etc/yum.repos.d/jenkins.repo。可以通过 vim 编辑更改以下 baseurl,去除后面多余的,注意:我们需要搭建 Node 的环境。第一步:安装 Node 的插件。第二步:配置 Node 的环境。安装 Jenkins。
2024-12-08 21:34:30
1121
原创 “React学习之旅:从入门到精通的点滴感悟“
2. 列表渲染3.JSX 语法规则3.1 插入内容jsx 中的注释JSX 嵌入变量作为子元素情况一:当变量是 Number、String、Array 类型时,可以直接显示情况二:当变量是 null、undefined、Boolean 类型时,内容为空;如果希望可以显示 null、undefined、Boolean,那么需要转成字符串;转换的方式有很多,比如 toString 方法、和空字符串拼接,String(变量)等方式;情况三:Object 对象类型不能作为子元素(not
2023-12-25 22:10:53
617
原创 webpack配置分离(详细)
💅 想寻找共同学习交流、共同成长的伙伴,文章最后有作者l联系方式(备注进群)当我们实际项目的开发过程中,webpack.config.js文件中的某些配置只是在开发环境中有依赖,并不想让其打包到生产环境中去,比如webpack-dev-server,有些配置是开发环境不需要,生产环境需要,比如压缩js代码的配置,因此对这里的配置做一个分离。
2023-05-21 14:00:00
704
原创 webpack性能优化方案(详细)
因为该插件webpack已经默认安装和集成,所以我们并不需要单独安装和直接使用该插件;只需要提供SplitChunksPlugin相关的配置信息即可;Webpack提供了SplitChunksPlugin默认的配置,我们也可以手动来修改它的配置:比如默认配置中,chunks仅仅针对于异步(async)请求,我们可以设置为initial或者all;SplitChunks自定义配置解析常用配置解析默认值是async另一个值是initial,表示对通过的代码进行处理。
2023-05-20 10:45:00
9955
原创 vite和webpack的区别(多层面分析)
webpack是基于Node的构建,JavaScript是毫米级别。vite是基于esbulid预构建依赖,esbulid是采用go语言编写的,go语言是纳秒级别。vite不需要经过打包,之前的浏览器不支持 ES module,在开发阶段不需要将代码打包成单个文件,而是通过预构建的方式直接加载模块。在生产环境中,Vite使用Rollup进行打包,生成优化的代码文件。Webpack使用了模块打包策略,将项目中的所有模块打包成一个或多个文件,需要打包转es5然后给浏览器运行。webpack:模块以及模块依赖的模
2023-05-16 17:04:26
964
原创 webpack开发服务器配置
比如在index.html中,我们需要依赖一个 abc.js 文件,这个文件我们存放在 public文件 中;在index.html中,我们应该如何去引入这个文件呢?✓ 比如代码是这样的:< script src="./public/abc.js">;但是这样打包后浏览器是无法通过相对路径去找到这个文件夹的;会报错解决:所以代码是这样的:< script src="./abc.js">< /script>;设置static即可;
2023-05-15 14:37:15
841
1
原创 云函数中无法调用axios请求失败问题。
今天写了微信云函数调用axios发现请求不来,报错。今天又是踩坑的一天。通过一波猛如虎的操作,考虑到axios版本问题,尝试降低版本。目前最新的axios应该是没兼容到node版本更新,所以才出的问题。然后点击按钮发送请求,竟然请求失败。💅 想寻找共同学习交流、共同成长的伙伴,文章最后有作者l联系方式(备注进群)这是我写的简单的发个请求。然后安装运行竟然可以了。
2023-05-07 13:49:18
625
原创 webpack基础笔记,后续有高阶笔记。
💂 个人网站:【紫陌】【笔记分享网站,进群就有】💅 想寻找共同学习交流、共同成长的伙伴,【前端学习交流群】
2023-04-17 17:34:32
473
原创 使用Vue3自定义指令,让你的应用更具交互性
在Vue的模板语法中我们学习过各种各样的指令:v-show、v-for、v-model等等,除了使用这些指令之外,Vue 也允许我们来自定义自己的指令。这篇文章主要讲Vue3指令,想看Vue2指令看我另一篇文章,Vue2自定义指令。文章最后有对比vue2和Vue3的指令区别自定义指令可用于定义复杂的行为或公用的行为。当你想要在多个组件中重用某个复杂的行为或逻辑时,就可以考虑使用自定义指令。自定义局部指令组件中通过 directives 选项,只能在当前组件中使用;自定义全局指令。
2023-03-29 18:02:04
1233
4
原创 类式与函数式封装原生wx.request,你更喜欢哪种方式?
💂💅原生的wx.request()存在以下缺点:回调函数嵌套过多:原生wx.request()是异步请求,需要使用回调函数获取响应结果。如果请求嵌套较多,回调函数嵌套层数会比较深,导致代码难以维护和阅读。错误处理繁琐:原生wx.request()返回的结果并不一定是正确的响应数据,还可能包含网络错误、超时、认证失败等错误信息。如果不进行错误处理,这些错误信息可能导致应用程序出现异常,而原生wx.request()并不提供方便的错误处理机制。
2023-03-25 11:47:27
534
1
原创 vant tabbar解决路径问题(根据路径显示高亮tabbar)
💂💅url路径匹配tabbar高亮问题。vant中的tabbar组件,遇到到url路径匹配tabbar高亮问题。
2023-03-20 17:22:28
931
1
原创 微信小程序详细登录流程(图解+代码流程)
💂💅微信小程序的登录和web端的登录有一点是不同的,小程序需要和微信的服务通信验证。微信小程序详细教程
2023-03-19 14:26:43
30711
19
原创 TypeScript中的interface和type区别
总结: 如果是非对象类型的定义使用type, 如果是对象类型的声明那么使用interface。interface 可以重复的对某个接口来定义属性和方法;但是使用interface就不可以定义非对象类型(语法错误)type类型使用范围更广, 接口类型只能用来声明对象。在声明对象时, interface可以多次声明。interface支持继承的,type不支持。interface可以被类实现。
2023-03-07 12:02:57
1706
1
原创 移动端适配的理解和各种方案解析(详解)
自适应:根据不同的设备屏幕大小来自动调整尺寸,大小。响应式:会随着屏幕的实时变动而自动调整,是一种自适应。
2023-02-24 11:05:24
10795
3
原创 Typescript中type和typeof的区别
在 TypeScript 中,type和typeof都是用于类型定义的关键字,但它们的作用不同。
2023-02-20 17:31:07
540
原创 CSS中的BFC详细讲解(易懂)
一个BFC区域只包含它的子元素,不包含其子元素的子元素。成为一个BFC区域要满足一定的条件。不同的BFC区域相互独立,互补影响。BFC是属于普通流的,我们可以把BFC看成页面的一块渲染区,他有自己的渲染规则,简单来说就是BFC可以看做元素的属性,当元素有了BFC这个属性,这个元素可以看做隔离了的容器,容器里面的元素不会在布局上影响到外面的元素。
2023-02-16 10:04:32
8047
3
原创 权限管理实现的两种方式(详解)
第一种:基于角色Role的动态路由管理。登录:登录验证通过之后后台会返回一个token给前端,前端会保存在vuex和本地(防止刷新丢失登录状态),然后拿token去后台请求一个userInfo的接口获取用户信息(用户名,权限信息等等)权限验证:通过token获取用户role信息,然后根据用户role算出对应应有权限信息的路由,最后用router.addRotes动态挂载计算出的路由。
2023-02-10 15:04:05
13298
8
原创 Vue中组件通信-$attrs与$listeners
listeners与$attrs(组件通信方式的一种)他们两者都是组件实例的属性,可以获取到父组件给子组件传递的props与自定义事件。
2023-01-31 20:36:29
5167
2
原创 ElementPlusError:[ElPagination] 你使用了一些已被废弃的用法,请参考 el-pagination 的官方文档
控制台说我分页器组件语法有问题,然后我就去看我的代码,反复看也没有问题,和文档都是一样的语法。后面我一个一个删除运行,当我删除total就没有了警告。total是是后台接口的数据的。我看看是不是数字类型。然后用typeof检查竟然不是Number类型。
2023-01-31 14:15:03
15616
12
原创 Vue中的sync属性修饰符(父子数据同步)
属性修饰符sync父子组件数据同步的一种,和v-model差不多可以实现父子组件数据同步:money.sync,代表父组件给子组件传递props['money'],给当前子组件绑定一个自定义事件(update:money)
2023-01-30 23:18:41
915
原创 深入Vue中v-model(详解)
这样就实现了v-model实现父子组件数据同步 (实现父子组件通信)组件上可以理解为v-model是 :value="msg" @input="msg = $event" 的语法糖
2023-01-18 12:15:00
1506
原创 Vue中自定义事件的深入
原生btn按钮-- 使用Event1组件:底下这个组件 @click.native 原生DOM事件,利用事件的委派-->-- 自定义事件对于原生DOM没有任何意义 -->-- 原生的btn
2023-01-17 08:45:00
350
原创 Object.asign实现对象拷贝
针对深拷贝,需要使用其他办法,因为 Object.assign()拷贝的是属性值。假如源对象的属性值是一个对象的引用,那么它也只指向那个引用。文章有写的不当的地方,欢迎指正修改。Object.assign()方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)。
2023-01-15 14:45:00
795
原创 swiper插件实现轮播图
即使这样也还是无法实现轮播图,原因是,我们轮播图的html中有v-for的循环,我们是通过v-for遍历bannerList中的图片数据,然后展示。注意:在创建swiper对象时,我们会传递一个参数用于获取展示轮播图的DOM元素,官网直接通过class(而且这个class不能修改,是swiper的css文件自带的)获取。但是这样有缺点:当页面中有多个轮播图时,因为它们使用了相同的class修饰的DOM,就会出现所有的swiper使用同样的数据,这肯定不是我们希望看到的。文章有写的不当的地方,欢迎指正修改。
2023-01-14 08:30:00
3574
原创 mock的基本使用
mockjs是用来模拟产生一些虚拟的数据,可以让前端在后端接口还没有开发出来时独立开发,mockjs可以拦截ajax请求,返回设定好的数据。注意:在server.js文件当中对于banner.json||floor.json的数据没有暴露,但是可以在server模块中使用。mock需要的数据|相关mock代码页书写完毕,关于mock当中serve.js需要执行一次,注意:mock(模拟数据)数据需要使用到mockjs模块,可以帮助我们模拟数据。**第六步:**回到入口文件,引入mockServe.js。
2023-01-13 04:30:00
1583
原创 多次执行相同的push、replace问题(重写push、replace)
||undefined}})时,如果多次执行相同的push,控制台会出现警告。注意:编程式导航(push|replace)才会有这种情况的异常,声明式导航是没有这种问题,因为声明式导航内部已经解决这种问题。文章有写的不当的地方,欢迎指正修改。由于vue-router最新版本3.5.2,引入了promise,当传递参数多次且重复,会抛出异常,因此出现上面现象。原因:push是一个promise,promise需要传递成功和失败两个参数,我们的push中没有传递。这种异常,对于程序没有任何影响的。
2023-01-12 20:02:15
1482
原创 Vue中路由传参的方式(含有一些问题)
业务:路由跳转,home模块跳转search模块,home的数据带上给search上使用。home.vue${this${thissearch.vue 获取传递过来的参数
2023-01-11 21:03:12
536
原创 error when starting dev server:Error: The package “@esbuild/win32-x64“ could not be found, and is n
启动npm run dev时报错。failed to load config from C:\Users\PC3803\Desktop\Vue3+TS\vue3_ts_cms\vite.config.tserror when starting dev server:Error: The package "@esbuild/win32-x64" could not be found, and is needed by esbuild."--no-optional" or "--omit=option
2022-12-23 14:05:15
9803
4
原创 Vue3中的pinia使用(收藏版)
pinia官方文档Pinia 的优点更多查看文档…在main.js中引入pinia并创建容器挂载到根实例上创建stores文件夹和index.js文件(这个文件以后基本不用管了)在stores文件夹下创建counter.js文件。这个文件就是存有关counter相关的数据。(类似vuex的模块化)defineStore 是需要传参数的,然后再组件中使用:运行效果: 可以用vue3的调试工具看pinia案例需求,点击按钮加一:一个不解构,一个不解构看看区别。运行结
2022-12-08 12:04:18
25366
16
原创 Vue3.x中的vue-router4.x的使用
路由跳转及参数的使用在vue3.x setup中 , useRouter、useRoute通常用来:vue-router 3.x中 获取路由参数:通配符 * 被取消keep-alive使用可利用keep-alive的 include 或 exclude 属性(include 和 exclude 包含的name 是组件的name不是router name)来设置缓存:vue2写法:vue3写法:注意:keep-alive 必须用在 router-view 内部文章有写的不当的地方,欢迎指正修
2022-12-06 11:25:59
775
原创 Vue3.2中的setup语法糖(易懂)
使用setup语法糖后,不用写setup函数;组件只需要引入不需要注册;属性和方法也不需要再返回,可以直接在template模板中使用。父组件:子组件:运行结果:script setup 是 vue3.2 的新语法糖,并不是新增的功能模块,主要好处有:因为没有了setup函数,那么props,emit怎么获取呢?setup script语法糖提供了新的API来供我们使用。父组件:子组件:运行结果:直接打印父组件传过来的值。defineEmits 子组件向父组件事件传递子组件:父组件:运行后
2022-12-05 17:59:06
2805
原创 若依框架RuoYi项目运行启动教程【傻瓜式教程】
若依官网若依在线文档首先去官网下载代码链接到码云下载,要么用git下载要么压缩包下载。然后再IDEA打开项目想要运行就要搭建好环境按照文档要求配置环境这些准备好了就可以开始运行了然后导入数据SQL文件位置创建数据库并且导入导入成功就有很多表,mysql就配置完毕下载Redis开启服务有着图标就是开启成功打开客户端管理工具数据库就配置完成了。在这个文件运行就可以了出现这个表示后端运行成功了在浏览器运行,这也表示后端运行ok的。切换到ruoyi-ui目录的终端运行 npm i 下载所有依赖我改了后端端口
2022-12-03 11:28:43
63230
22
空空如也
Vue脚手架报错的原因?
2022-02-22
正则表达式邮箱验证?
2021-11-03
HTML5canvas绘图,怎么去掉阴影?
2021-10-22
谁知道计算机二级网页是考什么
2021-06-25
Java 复写不知道哪里出错了
2021-06-22
定时器轮播效果帮忙解决一下?
2021-06-19
怎么在我的一个div盒子里面放图片实现轮播效果,我的不知道哪里错了
2021-06-19
暂停键停止不了,求大神
2021-06-18
帮看看哪里错了,小数转换整数错了应该?
2021-06-07
复数加法运算怎么写?
2021-06-05
判断字符串为空?看看代码哪里错了
2021-06-03
Java测试是否是同班同学,帮帮看看哪里错了?
2021-06-02
Java 大神们帮我看看这个代码?
2021-06-02
帮我想这么info函数怎么写
2021-06-02
Java 不知道哪个条件错了
2021-06-02
TA创建的收藏夹 TA关注的收藏夹
TA关注的人