WEB前端
文章平均质量分 61
莱米code
这个作者很懒,什么都没留下…
展开
-
cnpm adduser 报错 409 Conflict
踩坑日记 | npm登录一直失败,返回409 Conflict?本文记录了作者从发现到解决问题的完整心路历程,快跟着作者一步一步的解决它!原创 2023-03-01 12:59:27 · 927 阅读 · 0 评论 -
JS 指定元素滚动到屏幕中间
点击元素,使该元素滚动到屏幕中间<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"原创 2022-03-20 17:24:13 · 4062 阅读 · 0 评论 -
按照网上配置的 husky+lint-staged+prettier 为什么不生效
背景为了维护代码的统一性,引入了 eslint prettier 等一些格式化代码的工具。为了避免在代码提交时忘记格式化找到 husky+lint-staged 的解决方案。在网上很容易找到相关的文章,但是按照文章里的配置弄好后却不起作用。经过一番查询才知道最新版本的husky已经废弃了之前的设置方式。介绍一下husky@7.0.4一个git钩子工具,能够方便的帮助我们在一些 git 事件(add、commit…)触发前后做一些事情。我们主要使用pre-commit 钩子(执行 commit 前原创 2021-11-05 21:40:25 · 1951 阅读 · 0 评论 -
npm publish 400 maintainers
问题描述在使用 lerna publish 时, 出现如下错误,导致发包失败npm ERR! code E400npm ERR! 400 Bad Request - PUT http://registry.xxx.com.cn/xxx - maintainers error原因package.json 中缺少 maintainers 字段,需要将维护者用户名加入到该字段下解决方案 "maintainers": [ "xxx" ],...原创 2021-06-20 15:19:19 · 1089 阅读 · 1 评论 -
JS 阻止浮层弹窗下滚动
1. 利用移动端的 touchmove 阻止默认行为 _preventEvent(e){ e.preventDefault(); } // 禁用 document.documentElement.addEventListener('touchmove', this._preventEvent, {passive: false}) // 解除禁用 document.documentElement.removeEventListener('touchmove', this._pre原创 2020-10-23 14:19:45 · 655 阅读 · 0 评论 -
【Jump】 js 控制页面的滚动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>jump</title> <style> #box { background-color: pi原创 2020-10-22 11:38:44 · 1526 阅读 · 0 评论 -
三种主流的跨域解决方案(vue-cli3 package.json中配置跨域)
协议 - 域名 - 端口号 只要有一个不相同就是跨域,解决方案如下1. Http Proxy 代理在 vue-cli3 中取消了配置文件 vue.config.js,网上的跨域处理多为新建配置文件,对于有代码洁癖的我这样是不允许的,在读了一番文档后,结合网上的实现方案得到如下解决方案在 package.json 中加入 vue 字段(下面的代码段)如果请求的地址不是 /api,借助 pathRewrite 将 /api 替换我用的是 axios 进行网络请求,在封装 axios 时设置 base原创 2020-09-04 22:36:22 · 1456 阅读 · 3 评论 -
vue - symbol方式引入阿里巴巴字体库
官方链接找到想要使用的图标,添加入库添加到自己的项目(提前建好)进入项目5. 我的是vue项目,在 public - index.html 中添加复制的地址6. 在 App.vue 的 style 中写入样式.icon { width: 1em; height: 1em; vertical-align: -0.15em; fill: currentColor; overflow: hidden;}使用 并设置自己的样式原创 2020-08-22 22:47:39 · 663 阅读 · 1 评论 -
img标签加载错误403,浏览器地址栏能正常显示
描述在 img 标签加载其他网站的图片,一直返回错误 403解决这是比较常见的反盗链技术反盗链详情找到原因后我们就有解决方案了,在标签上添加 referrerpolicy="no-referrer<img src="xxx" alt="img" referrerpolicy="no-referrer">MDN...原创 2020-08-19 10:24:49 · 408 阅读 · 0 评论 -
前端中的二进制
ArrayBufferArrayBuffer:用来表示通用的、固定长度的原始二进制数据缓冲区。它是一个字节数组,通常在其他语言中称为 byte arrayTypedArrayTypedArray :它是一个指定特定元素类型(Int8Array)的统称,详情见 MDNlet buffer = new ArrayBuffer(8); // 8个字节的ArrayBufferconsole.log(buffer.byteLength); // 8字节const int8Array = new原创 2020-07-17 17:54:56 · 1550 阅读 · 1 评论 -
200行代码实现简易的 mvvm - vue
第一个知识点 - Object.defineProperty()说明: 直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。备注: 应当直接在 Object 构造器对象上调用此方法,而不是在任意一个 Object 类型的实例上调用。在这里我们需要了解 get 和 set 方法const data = {}let value = ''Object.defineProperty(this.data, "msg", { get(){ /原创 2020-07-17 16:04:40 · 288 阅读 · 0 评论 -
canvas web 跟随鼠标绘制矩形框
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>跟随鼠标绘制矩形框</title> <style> #canvas {原创 2020-06-30 15:30:08 · 3009 阅读 · 2 评论 -
TCP三次握手四次挥手总结
概念标志位ACK - 确认序号的标志,ACK=1表示确认号有效,ACK=0表示报文不含确认序号信息SYN - 连接请求序号标志,用于建立连接,SYN=1表示请求连接FIN - 结束标志,用于释放连接,为1表示关闭本方数据流序号 - 表示发送的数据字节流,确保TCP传输有序,对每个字节编号seq - x (123123123)ack - x+1 (123123124)三次握手第一次发送请求建立连接报文, SYN = 1,seq = x,等待服务端确认, 客户端进入 S原创 2020-06-24 10:35:27 · 192 阅读 · 0 评论 -
vue h5 video 多视频无缝切换
思路页面中创建两个 video 标签在组件加载时同时加载两个视频资源(autoplay),暂时不播放的视频在 canplay 事件中调用暂停方法,使之实现预加载使用绝对定位将预加载的视频移出可视窗口第一个视频结束后,通过 ended 事件播放之前预加载的视频,同时将当前 src 切换为下一个需要播放的视频地址,完成缓存核心代码 <video ref="video" :class="{'video-hide':!playVideoTag}" autoplay @ended="onE原创 2020-06-17 20:23:13 · 5633 阅读 · 5 评论 -
弹性布局 - Flex(Flexible Box)
弹性布局 - Flex(Flexible Box)1.原理给父盒子指定 display:flex 控制子盒子的位置和排列方式2.父项属性flex-direction:设置主轴的方向row :x轴正方向(默认)row-reverse:x轴负方向column:y轴正方向column-reverse:y轴负方向justify-content:设置主轴上的子元素的排列方式(使用时...原创 2020-05-07 23:33:16 · 214 阅读 · 0 评论 -
浏览器渲染原理
第1阶段 Request通过URL向服务器发送请求,web服务端返回html文本-代码字符串DNS解析TCP三次握手四次挥手HTTP/HTTPS/HTTP2第2阶段 Response拿到代码后,浏览器在内存中开辟一块栈内存,用来给代码提供执行环境;同时分配一个主线程去一行一行的执行代码第3阶段 执行代码执行方式取出一行代码,进栈执行 -> 执行完出栈当浏览器...原创 2020-04-27 22:30:58 · 136 阅读 · 0 评论 -
.eslintrc.js
module.exports = { root: true, parserOptions: { parser: 'babel-eslint', sourceType: 'module' }, env: { browser: true, node: true, es6: true }, extends: ['plugin:vue/rec...原创 2019-12-03 18:38:48 · 298 阅读 · 0 评论 -
postman mock 前端模拟后台接口数据
原创 2019-10-08 17:37:55 · 776 阅读 · 0 评论 -
Vue 中的 v-bind 说明
最近在学习Vue, v-bind一直搞不懂,感觉属性绑定这个概念很模糊,通过以下例子解释v-bind.这是未加v-bind示例<input type="button" value="按钮" title="msg" id="app"><script> let app = new Vue({ el: '#app', data: ...原创 2019-08-14 20:21:17 · 456 阅读 · 0 评论 -
解决跨域问题 Django-ajax
实现功能前端向后端跨域发出请求,将小写字母转为大写,动态添加到网页。服务器端(python-Django)views.pydef upWords(request): # get方法 callBack = request.GET.get('callback') # 返回时建议使用占位符拼接,不然会解析错误 return HttpResponse("%s('%...原创 2019-07-28 16:59:27 · 136 阅读 · 0 评论