javascript
文章平均质量分 53
Ruonorth
The more you do,the more you can do.
展开
-
rollup打包第三方依赖
相比于webpack的通用性来说,rollup更专用于esmodule的处理。这在某些场景下会需要一些额外的配置来处理特殊场景。但是如果你使用的这个三方库没有默认default,则需要配合@rollup/plugin-commonjs使用。这是因为rollup打包会处理相对路径,对于npm包的绝对路径引用是不会做任何处理的。这种情况可以用插件处理。此时不出意外的话,第三方模块已经顺利打包进bundle包了。rollup在打包时是不会处理process环境的,这种情况需要插件额外处理。至此配置就全部完成了。原创 2022-09-29 19:04:18 · 5748 阅读 · 0 评论 -
webpack动态加载——懒加载实现
webpackMode如果不写的话,模块是不会单独打包成一个独立模块的。因为使用本地真实路径,node_modules的相关配置都会失效的。其中symlinks配置是用来标识是否将模块引入解析为真实路径。如果你需要打包的模块是自己用npm link链接的模块记得关闭。对于懒加载来说,不是独立模块是没办法在需要的时候单独加载的。./conf.base.cjs 基础配置。原创 2022-09-29 18:46:49 · 1703 阅读 · 0 评论 -
git——仓库合并不丢失git记录
在开始进行仓库合并之前先大致梳理一下合并的原理,这样才能在出错的时候找到合理的解决方案。如果想直接看操作,看部分即可。原创 2022-09-22 18:41:48 · 858 阅读 · 0 评论 -
sentry——sourceMap解析错误解决
在local的22.8版本sourcemap执行正常,在远端的22.5版本,sourcemap解析异常。发现并无差异,这里推测是22.5到22.8升级时做了更合理化的解析。经过验证为框架内路径与线上路径映射问题,最终解决方案路径为更名。至于为什么本地可以解析远端不可以,在对比相关配置后。至此,sentry就可以正确寻址到对应源框架了。这时sourceMap解析可以正常解析。经过cli工具分析得到错误如下。这里尝试修改源文件的映射地址。可以看到这里的url地址是。完整的解决方案分为两种。原创 2022-09-22 18:15:57 · 1968 阅读 · 0 评论 -
HTTP资源预取
如果用户进入指定的链接,隐藏的这个页面就会立马进入用户的视线。用户代理应尽可能尝试启动预连接并执行完整的连接握手(DNS+TCP 用于 HTTP,DNS+TCP+TLS 用于 HTTPS 源),但允许选择执行部分握手(DNS 仅用于 HTTP , 和 DNS 或 DNS+TCP 用于 HTTPS 来源),或完全跳过它,由于资源限制或其他原因。作为元素 的属性 rel 的值,是为了提示浏览器,用户未来的浏览有可能需要加载目标资源,所以浏览器有可能通过事先获取和缓存对应资源,优化用户体验。原创 2022-09-20 20:36:00 · 426 阅读 · 0 评论 -
sentry安装过程故障排查
将安装prefix目录设置为该目录。当不设置,将默认安装至node安装的目录,最后更新path。报错EACCES: permission denied。具体原理是切到用户目录创建用户有权限的全局文件,查看所有创建的全局链接。原创 2022-09-20 20:34:19 · 562 阅读 · 0 评论 -
lerna管理多仓库
【代码】lerna管理多仓库。原创 2022-09-20 20:31:08 · 256 阅读 · 0 评论 -
错误监控——sentry源码
sentry-javascript为语言包,在该语言包下包含各项平台包。原创 2022-09-15 19:33:55 · 896 阅读 · 0 评论 -
基于Vue-cli的多目录项目配置
直接用vue-cli创建的项目可以创建一个单页面应用,开发环境和生产环境都是以一个单独的项目为目录的。在写一些有共性的模块时需要将所有组件放在同一个大的框架下的同时又需要每个模块可以进行单独的启动和打包。此时就需要进行个性化配置。原创 2018-09-28 02:56:55 · 5305 阅读 · 2 评论 -
移动端手势封装
目录概要手势封装的兼容问题与解决方案TouchEvent事件详解(译自W3C)手势封装的实现一、手势封装的兼容实验在微信浏览器及手机自带浏览器当中的自带手势会影响事件的触发微信的自带手势包括但不仅限于页面顶部下拉刷新长按弹出菜单上下滑动翻动页面双指缩放在有默认手势时可能出现的问题有无法正常触发touchend事件,使用小米、vivo、oppo、苹果进行实验,实验结果...原创 2018-09-18 17:22:07 · 755 阅读 · 0 评论 -
js易错知识点总结
注:没有标注书名只有页数的参考来源均指代《Javascript权威指南第六版》,其他参考均有书名或网址标注。 一、易产生误区知识点记录 1、[] == ! [] 所有对象都转化为true(P52),数组是对象,因此空数组[]转化为布尔值为真。而空数组转化为数字时为0.因此左式Number([])=0。 “!”运算符首先将操作数转换为布尔值,然后再对布尔值求反(P81),因此右式为!Bool...原创 2018-01-15 13:54:36 · 855 阅读 · 0 评论 -
轮播图实现原理
具体代码和思路如下: 效果图: 思路: 常见轮播图的功能就是: ①图片自动轮换 ②点击左右两侧的箭头切换 ③正下方的小点显示正在播放第几张 实现思路: ①设置一个container容器用来显示图片。container大小为图片大小。将该container居中显示,且position设置为relative。这样可以使它的子元素相对于它进行绝对定位 ②设置一个容器box用来装图片。原创 2017-08-26 22:57:59 · 2506 阅读 · 0 评论