暂时未有相关云产品技术能力~
用计算机创造美和艺术,用代码改变世界
使用浏览器插件提升前端项目调试速度
微前端框架qiankun在vue项目中使用遇到的子应用白屏问题,通过主应用挂载子应用的方式进行子应用的页面功能开发,排查问题是 webpack资源路径配置导致,修改 publicPath 配置解决问题
Element Table 表格拖动,数据上下移
一个 vue2.0 项目,执行 npm run dev 正常,但是 npm run build 出现打包错误。
supervisor 会监视代码的改动,并自动重启 Node.js。 Node 启动服务的时候一搬为 node server.js,每次代码改动都需要重新执行 node server.js 。下载 supervisor 使用 supervisor server.js 可以实现热加载效果。
Git是目前世界上最先进的分布式版本控制系统。在当前目录新建一个Git代码库,新建一个目录,将其初始化为Git代码库。
主要介绍Email验证,手机号码验证,用户名验证的3种方法。
Vue 项目中使用了 annotorious 插件,根据需要修改源码,但是修改过后的js文件无法通过 import 形式引入,纠结了好几天,现在把解决方案记录一下。
这里接 qiankun 实战(一) , 上一篇实现了主应用和子应用引入 qiankun, 接下来记录主应用和子应用之间运行嵌套,路由跳转,数据通信。
前两天用了一下微前端框架 icestark, 在实际架构搭建过程中发现中发现在 Vue 主应用子应用之间切换 tag (tag 分别主应用和子应用的页面)页签时会有子应用数据状态无法保存的情况,搜索了一波解决方案后发现,icestark 中 React 应用实现了对数据状态的缓存,Vue 里面没有这个实现。
React Native Android 项目使用 ./gradlew assembleRelease 命令打包报错
使用 Git clone 一仓库,报错,这种情况一般是网络不稳定导致,如果重新 clone 尝试是否成功;如果还出现这个问题,也有可能 ssl 证书验证方面的问题, 设置 httpsslVerify 属性取消验证,执行如下命令。
React Native 最快的键/值存储。 MMKV是微信开发的一个高效、小型的移动键值存储框架。更多信息请参见腾讯/MMKV react-native-mmkv是一个库,允许您在 React Native 应用程序中轻松使用MMKV。它提供了对原生 C++ 库的快速和直接绑定,可通过简单的 JS API 访问这些库。
React Native Android 环境搭建开发过程中, adb devices 命令查询手机设备,提示命令不识别,Android SDK Tool 等安装都OK的情况下,这种情况一般是没有配置环境变量导致的,找到 Android\Sdk\platform-tools 目录位置。
原因分析,可能代码写法哪里有误,可能由于 index2.html 代码块执行太快,iframe 中内容还未完全加载和渲染就结束了.
在 win10 系统中,首次提交项目代码到公司内部 GitLab 远程仓库,出现 WARNING: POSSIBLE DNS SPOOFING DETECTED! 错误,如上图 因为我们的远程仓库是没问题的,在Ubuntu系统里日常代码提交都正常,根据错误描述提示,分析应该是 known_hosts 文件中的内容 [git.sg-ai.com]:2289 改变导致.
使用CDN链接引入必备的文件,一个css,一个js文件。如下: (注意个别站点的cdn链接国内有时候无法访问,用之前可以先在浏览器测试一下)
一个部署在国外的项目,在国内访问有些国外站点资源速度太慢,或无法访问,因此单独部署了一台香港的服务器用于中国大陆用户访问 希望前端代码可以判断用户地区(主要是国内大陆用户),自动重定向到香港服务器的站点
可以通过 div 的方式 拼凑 一张图,然后 js 代码控制不同的 div 部件进行颜色变化。可以通过 canvas 的方式绘制整张图,然后对画布内的元素进行控制。可以找个第三方库,自定义形状 组合 一张图出来,然后进行控制。可以通过 svg 图的方式展示内容,然后对 svg 中的元素进行控制。
Math.random() 函数返回一个浮点,伪随机数在范围0到小于1,也就是说,从0(包括0)往上,但是不包括1(排除1),然后您可以缩放到所需范围。实现将初始种子选择到随机数生成算法;它不能被用户选择或重置。一个非密码学安全的随机数来源。
自定义 Markdown 字符串页面显示,先 new 一个 Converter() 函数对象,然后调用 makeHtml() 函数双向绑定 template 进行内容显示。
将 /dev/sda1 对应的 /media/w/9f6a2add-e287-4bf7-8e71-76cde406b11c 目录内容挂载到 /mnt/sda1 目录中,使用 sudo mount /dev/sda1 /mnt/sda1 命令。
主要介绍这几部分:Preview,Install,Useage in vue component,Tips,Project address。
主要介绍Install MongoDB Community Edition,WebSite,Docker Use MongoDB这三个部分·。
Vega-Embed 在 Vue Typescript 项目中引入报错 Cannot find module 'vega-typings',一开始以为Vega相关包版本在TypeScript中不支持,更新版本,调整引入方式的写法都不行,Baidu,Google, Github issues 中找了一波问题后也没发现有人遇到 Vega 的引入问题。
使用 locust 测试过程中,在压力机性能瓶颈范围内可以通过调整用户数和脚本 wait_time 参数来测试 RPS 值,超过压力机性能范围后 RPS 数值无法继续变大。TPS(Transactions Per Second)事务数/秒。一个事务是指一个客户机向服务器发送请求然后服务器做出反应的过程。客户机在发送请求时开始计时,收到服务器响应后结束计时,以此来计算使用的时间和完成的事务个数。
解决方案,由提示可以分析是Android APP 打包没有生成证书导致,在确保本地安装了 java 和 javac 的情况下,在Android项目根目录下执行证书生成命令。
通过 Cordova 打包的 Vue 项目,APP 在 Android 设备中可以访问页面,但是无法访问后端接口。
Cordova 打包 Vue 项目到Android打开白屏问题解决方案,更改 publicPath 属性值为 ./。
Vue2.6 , Typescript3 项目引入 Echarts 时报错,错误出现在 ECharts.vue 第17行 const mainEle = this.$refs.main,将 this.$refs.main 内容修改为 this.$refs.main as HTMLDivElement 即可。
使用 accept 属性,accept 属性的值是一个包含一个或多个(用逗号分隔)这种唯一文件类型说明符的字符串。每个唯一文件类型说明符可以采用下列形式之一。
Vue2.6 + TypeScript3.4 项目中使用 this.$refs.fileInput.files.length 报错,提示 files 类型不存在 Property 'files' does not exist on type 'Element | Element[] | Vue | Vue[]',在不使用TypeScript时上面的写法可以正常运行的,但是这样的写法在TypeScript 中会报错。
通过修改 Vuetify 中的 theme.dark 属性实现,项目 vuetify 设置如下(vuetify.js), 默认 dark 属性值为 false (默认浅色主题)。
Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。
根据选择的文件,显示像系统一样的文件大小,而不是字节。 如: 1073741824 (B) 显示 1G。
删除 download 分支,查看本地分支,没有 download 分支了,使用 git log -g 查看所有 commit,根据 commit 记录查找功能分支(download)的 commit 提交,删除的分支 commit 没有分支记录。
前端项目使用 npm install vuetify --save 命令时出现错误,解决方案使用 npm cache clean --force 清理 npm 缓存 设置官方源地址 npm set registry https://registry.npmjs.org/。
iOS 中页面如果出现滚动条后,滑动浏览内容时会感觉特别卡,在移动设备上体验很不好,css代码中,需要滑动的地方 添加 -webkit-overflow-scrolling: touch; 在 safari 浏览器(iOS中也适用)中,在手指停止滑动后,页面会根据惯性继续滑动。
小程序项目开发中有这么一个需求,接口返回 <div>abc<p>123</p></div> 字符串,然后在小程序页面显示。
先使用 brew 卸载 node,执行 brew uninstall node,忽略依赖卸载 node brew uninstall --ignore-dependencies node,执行 brew uninstall --force node 卸载所有版本。
在 Vue 项目中的主页(Home.vue)设置返回键,点击返回后 APP 自动后台运行,在 Home.vue created() 中设置回退按钮监听事件。
最近进行 Element UI 组件封装,在之前的项目中经常用到 el-scrollbar这个内置组件,这次单独封装时遇到点写法上的小问题,做个记录和分享,希望能帮到相关的开发者。
新项目 Elemnet UI 组件业务封装,封装需求满足后期不修改业务代码,直接更新前端的封装组件的UI库代码即可实现无缝切换UI库的需求。目前新项目的功能产品还在梳理,项目第一期还未开始,前端技术小组先行进行的组件封装。
实际前端开发中,对接线上发布的后端接口,由于业务比较复杂,也设计到以前的库表,开发过程经常会出现部分页面数据不完整,无法对接整个流程,日常前端开发也有其他方式实现功能测试验证。
公司用了好几个年的核心业务系统今年升级重写,目前使用的版本是 V3 版本的xxx系统平台,简称 V3系统,升级大版本 V4, 前端技术架构也对应做了调整。 V3系统前端使用的是 Angular1.5 ,前后端不分离模式,后端是 .net。V4 要升级成前后端分离模式,前端使用 Vue2 结合 ElementUI 库,目前Vue2 + ElementUI 技术栈相关的使用在公司内部项目里用的都是这个。
微前端本质和后端微服务理念是一样的,微前端解决方案一般包含如下特点: • 在保证一个系统的操作体验基础上,实现各个微应用的独立开发和发版 • 不同子应用统一管理 • 提供应用间互相通信,跳转页面切换的能力
微前端中都需要的通信, 主应用与子应用通信,子应用之间的通信。使用 @ice/stark-data 包,需要单独安装,在主应用中设置全局用户信息,主应用中更新数据。
这是个 Vue 项目, 当看到这个 TypeError: Cannot read properties of undefined(reading 'key') 这行报错的时候,我的第一反应是 v-for 绑定的 key 有问题。
公司的项目有安全合规方面的需求,上线前要经过安全架构师进行安全测试,安全测试通过才能上线,目前 APP 项目中涉及到的点整理如下。
最近上线了一个 React Native 外访项目,用户为公司外访员,外访员根据公司业务去实地考察,收集记录一些资料,考察记录资料的过程全部用公司配的专用手机,里面安装了当前外访项目APP。目前项目试运行阶段,还没有正式交付。APP项目上线后,在用户真实使用中遇到一些各种各样的问题,有些问题处理时也比较棘手(如弱网情况),这次主要复盘APP在实际场景中的弱网(或网络不稳定)相关的问题。