前端
文章平均质量分 52
Missy Peng
小猫在午睡,地球在转圈。
展开
-
高德WMTS图层 调用天地图瓦片地图
项目需要展示海外地点标注(且卫星图与标准矢量地图切换),但是高德地图不显示海外地点数据,查了高德的海外LBS服务,是收费的,而且还处于试运行状态,遇到问题还得提工单,比较麻烦。后来查了查资料,发现天地图可以满足需求,而且天地图提供给WMTS服务,高德有个TileLayer类可以直接调用WTMS服务。所以便采用使用高德进行点标注等功能,调用天地图的图层方案,完成项目。实现// 天地图的访问keyconst key = "yourkey";// 初始化layerthis.staelliteLayer原创 2021-08-12 21:39:45 · 4167 阅读 · 4 评论 -
vue-amap、兼容高德原生sdk 实现多个点标记、自定义信息窗体
vue-amap与高德原生sdk一起使用时,需要在index.html里面引入原生sdk<html lang=""> <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">原创 2021-08-12 20:52:53 · 1009 阅读 · 0 评论 -
H5端 调起WhatsApp选择联系人以及给固定联系人进行内容分享
封装了一个工具类,如果传入参数phone,则发给指定联系人,不传入phone,则到WhatsApp应用中选择联系人进行分享util.js/** * 调起第三方 whatsApp 应用进行内容分享 * 如果传入参数phone,则发给指定人,如果不传入参数,则可以选择联系人进行分享 * @param {Object} phone */export function share(phone) { const curHref = window.location.href; // content是自原创 2021-06-27 11:37:49 · 3546 阅读 · 0 评论 -
webpack externals键值研究
做性能优化缩小打包体积时,利用externals+cdn方案,防止将某些 import 的包(package)打包到 bundle 中,而是在运行时(runtime)再去从外部获取这些扩展依赖。能够了解externals的键为依赖的包名但对于这个externals的值就有点迷了,官方文档上给的解释是酱紫的:关键的一句话是:为了替换jquery模块,jQuery的值将被用来检索一个全局的jQuery变量对于这句话我的理解是:import $ from 'jquery'中,原始没配置过externa原创 2021-06-11 17:44:12 · 275 阅读 · 1 评论 -
vue-cli3.x 配置打包可视化插件webpack-bundle-analyzer
介绍最近学习webpack的时候发现了一个好用的插件——webpack-bundle-analyzer,这个插件可以在代码运行或者打包的时候,清晰的用图展示出打包情况:bundle 的具体打包了什么展示包以及文件的打包前、后、Gzip体积找到哪些模块导致了bundle的体积过大(包的体积越大占据图示方块的面积越大)进行优化配置安装:# NPMnpm install --save-dev webpack-bundle-analyzer# Yarnyarn add -D webpac原创 2021-06-11 16:51:21 · 549 阅读 · 1 评论 -
vue、uniapp 动态创建input进行文件上传
占位 <view ref="input" class="input"></view> mouted里创建input// 创建inputmounted() { input = document.createElement('input'); input.type = 'file'; input.onchange = this.inputUpload; this.$refs.input.$el.appendChild(input); },文件上传//.原创 2021-03-21 11:00:29 · 1287 阅读 · 2 评论 -
box-sizing失效情况
box-sizing: content-box;//宽度和高度分别应用到元素的内容框。在宽度和高度之外绘制元素的内边距和边框。box-sizing: border-box;// 为元素设定的宽度和高度决定了元素的边框盒。就是说,为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。分析;如果目标元素的高度(或宽度)只由其内容、padding、border确定的情况下,则会存在失效情况。解决方法:对目标元素设置固.原创 2021-03-14 10:59:37 · 6740 阅读 · 2 评论 -
eslint关闭 nodef 校验
方法一:eslint添加globals全局变量globals: { // 设置jquery为全局 "$": true},rules: { ...}globals里面的变量被eslint识别为全局变量,就不会报nodef错误方法二:直接关闭eslintnodef校验"no-undef": 0...原创 2021-03-08 16:20:06 · 407 阅读 · 0 评论 -
VScode+ESlint 自动格式化代码(2021)
本文用 Vue 项目做示范,基于项目已有eslint环境。利用 Vue CLI 创建项目时要将 ESlint 选上,下载完依赖后,用 VSCode 打开项目。1、安装插件 ESLint,2、配置eslint插件File -> Preference-> Settings(如果装了中文插件包应该是 文件 -> 选项 -> 设置),搜索 eslint,点击 Edit in setting.json将以下选项添加到配置文件 //配置eslint "eslint.val原创 2021-02-21 12:15:52 · 16451 阅读 · 11 评论