- 博客(32)
- 收藏
- 关注
RSS订阅原创 前端文件打包体积优化
一、去除生产环境sourceMapvue项目打包之后js文件夹中，会自动生成一些map文件，占用相当一部分空间map文件的作用在于：项目打包后，代码都是经过压缩加密的，如果运行时报错，输出的错误信息无法准确得知是哪里的代码报错，有了map就可以像未加密的代码一样，准确的输出是哪一行哪一列有错。生产环境是不需要sourceMap的，如下配置可以去除module.exports = { //去除生产环境的productionSourceMap productionSourceMap:
2021-09-16 17:21:32
1616
原创 极客时间《mysql必知必会-实践篇》笔记
实践篇：会从项目最基本的数据存储和操作开始讲起，包括创建数据库、数据表、对表中的数据进行增删改查操作、使用函数、表与表之间的关联操作等，帮你快速掌握最基本的用法。目录01 一个完整的存储过程是怎样的02 这么多字段类型，该怎么定义？03 表怎么创建和修改数据表？04 增删改查：如何操作表中的数据05 如何设置主键01 一个完整的存储过程是怎样的我们学习了数据存储的完整过程，包括创建数据库、创建数据表、确认字段和插入数据。建议你跟着文字和视频实际操作一下，熟练掌握存储数据的.
2021-08-22 22:45:17
1735
原创 云原生学习系列（一）安装篇：win10安装docker与k8s
完整的安装过程，各种坑已经踩过，新手必看！1，准备工作确认win10为企业版、专业版或教育版问：为啥啊？答：因为要开启Hyper-V, 这是Docker Desktop for Windows 所使用的虚拟机，docker只能运行在linux环境.问：我不是，可咋弄嘞？？答：淘宝，搜索win10升级，5块钱搞定！开启Hyper-V前提：Windows 10 企业版、专业版或教育版 具有二级地址转换 (SLAT) 的 64 位处理器。 CPU 支持 VM 监视器..
2021-07-09 15:23:19
353
原创 微前端分享
qiankun 是一个基于single-spa的微前端实现库，旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。qiankun 孵化自蚂蚁金融科技，目前 qiankun 已在蚂蚁内部服务了超过 200+ 线上应用，在易用性及完备性上，绝对是值得信赖的。Techniques, strategies and recipes for building amodern web appwithmultiple teamsthat canship features independ...
2021-04-13 16:09:49
186
1
原创 聊聊如何保障前端代码质量和代码风格
前端代码风格及质量管控方法构建统一的代码风格及代码检查工作流，提升前端应用质量前言: 工具介绍”eslint“: javascript代码检测工具”eslint-plugin-vue“：针对vue的eslint插件“stylelint”: css检测工具“stylelint-config-standard”: stylelint的推荐配置“stylelint-order”: css属性排序插件，合理的排序加快页面渲染“stylelint-scss”: 增加支持scss语法
2021-02-24 15:59:23
488
原创 jenkins pipeline类型
1，脚本式流水线新建任务-选择流水线时，会有两种类型的配置1.1 pipeline script：直接在Web UI的script输入框里面输入pipeline script语句即可，参考说明可以点击输入框下边的Pipeline Syntax，里面有很多示例操作说明，非常好用。1.2 pipeline script from SCM：需要配置SCM代码存储Git地址或SVN地址，指定script文件Jenkinsfile所在路径，每次构建job会自动去指定的目录执行script文件。以上两种方法定义
2020-05-25 17:34:43
600
原创 跨域请求时，OPTIONS请求触发条件
OPTIONS请求即预检请求，可用于检测服务器允许的http方法。当发起跨域请求时，由于安全原因，触发一定条件时浏览器会在正式请求之前自动先发起OPTIONS请求，即CORS预检请求，服务器若接受该跨域请求，浏览器才继续发起正式请求CORS预检请求触发条件 1. 使用了下面任一HTTP 方法： PUT/DELETE/CONNECT/OPTIONS/TRACE/...
2020-04-14 09:48:35
3620
原创 从零搭建web前端持续集成环境: github+jenkins+nodejs+nginx
CI：Continuous Integration，也就是持续集成CD：Continuous Delivery 和 Continuous Deployment，也就是持续交付、持续部署一般工作流程：开发人员提交代码到Git/svn版本仓库；Jenkins人工/定时触发项目构建；Jenkins拉取代码、编译、打包/打包镜像；Jenkins部署构建物到目标VM/Docker前端...
2019-03-08 11:02:42
2081
原创 端到端测试之cypress
端到端测试 End to End Testing（e2e）: 站在用户角度的测试e2e测试是把我们的程序堪称是一个黑盒子，我不懂你内部是怎么实现的，我只负责打开浏览器，把测试内容在页面上输入一遍，看是不是我想要得到的结果。1、为什么要用Cypress？安装简易：一行命令或者下载解压安装包就可以安装完毕依赖较少：不用安装jdk, python之类的东西dom选取：提供了图形化的dom...
2019-01-11 12:10:54
2354
原创 浏览器静态资源缓存问题
一、场景：页面功能不可用，打开控制台发现js静态资源找不到，见下图二，分析：可能是由于Nginx上发布了新版本，而浏览器存在缓存，此次操作仍然请求的是原来的静态资源。 ps：什么情况用缓存，什么情况会更新？ js文件比如叫做http://xxx.aaa.com/hello.js，如果更改了hello.js又想让浏览器不要使用缓存而是加载你新...
2018-05-15 16:37:40
6916
原创 使用nrm管理npm源
1，安装nrmnpm install nrm -g --save2, 可以使用 nrm ls 命令查看默认配置, 带*号即为当前使用的配置3,nrm add 命令添加公司私有npm源, 起个别名叫taikangnpm4,切到公司npm源，命令：nrm use taikangnpm可以用nrm current查看当前源...
2018-05-11 18:20:16
3563
1
原创 GitHub和码云互搬、GitHub内仓库搬运
GitHub和码云互搬、GitHub之间搬运过程：从要搬运的出发地A，下载到本地，再上传到B(目的地)1，从A处将项目clone到本地2，用 Git Bash 寻找到下载到本地的代码仓库3，用命令删除之前关联的 A 的远程仓库 git remote rm origin4, 在B新建仓库，复制地址5，重新关联新仓库地址： git remote add origin htt...
2018-03-02 14:56:10
1774
转载 vue 双向绑定 getter 和 setter
它的每个属性都有两个相对应的get和set方法，我觉的这是多此一举的，于是去网上查了查Vue双向绑定的实现原理，才发现它和Angular.js双向绑定的实现原理完全不同，Angular是用的数据脏检测，当Model发生变化，会检测所有视图是否绑定了相关数据，再更改视图。而Vue使用的发布订阅模式，是点对点的绑定数据。Vue的数据绑定只有两个步骤，compile=>link。我一直在想，vu
2018-01-30 14:27:12
1699
原创 创建.gitignore文件，忽略git不必要提交的文件
从GitHub clone下来的项目是没有node_modules文件夹的，需要npm install之后才会下载下来，node_modules里的文件是需要被Git忽略的；1、在需要创建 .gitignore 文件的文件夹, 右键选择Git Bash 进入命令行，进入项目所在目录。2、输入 touch .gitignore ，生成“.gitignore”文件。3、打开”.gitignore” 文件
2017-12-18 16:15:37
2108
原创 浏览器解析和渲染过程
html各种渲染都是从浏览器开始的，分为浏览器解析和浏览器渲染两大步骤一、浏览器解析1、浏览器通过请求的 URL 进行域名解析，向服务器发起请求，接收文件（HTML、CSS、JS、Images等等）。 2、HTML 文件加载后，开始构建 DOM Tree 3、CSS 样式文件加载后，开始解析和构建 CSS Rule Tree 4、Javascript 脚本文件加载后， 通过 DOM API 和
2017-09-21 14:50:41
549
原创 Angularjs Controller 间通信方式、vue组件之间通信
angularjs开发项目中，不同组件通常对应着不同的控制器Controller ，组件之间的通信（如参数的传递，数据的传递）是很常见的场景，下面介绍两种方法：1、基于angular服务的方式（Service）2、基于事件广播的方式（$$on、$emit和$broadcast）
2017-09-01 16:37:21
678
原创 angularjs 瀑布流
场景：当要展示的数据较多又不想做分页展示时，页面先加载出一部分（页）数据，滚动条滚动到底部，数据（图片或者表格）继续加载一部分（页）。 好处：避免一次加载出大量数据时加载时间过长。 原理：监听滚动条，当滚动到下部时，即调用某函数，该函数向后台请求一部分数据，并push到要展示的数组中。
2017-08-23 20:16:43
570
转载 intellij idea文件颜色代表的含义
在IDEA 编辑器里，有着各种颜色的文件， 它们代表的意思是什么呢？ 如下 其实，这主要和你的版本控制工具相关绿色，已经加入控制暂未提交红色，未加入版本控制蓝色，加入，已提交，有改动白色，加入，已提交，无改动灰色：版本控制已忽略文件。另外：些文件名的颜色都是可以修改的，颜色的意义是根据你的设置看的。1、打开settings2、Edit
2017-08-18 09:40:29
41711
7
原创 IDEA配置web项目、部署Tomcat、配置maven
刚开始学习使用IDEA配置web项目，经过同事的帮助和网上的教程，结合自己的实践，将IDEA 配置web项目、部署Tomcat、配置maven三部分内容做一个总结。
2017-08-11 17:58:54
36645
1
原创 响应式布局的实现
完成响应式布局的实现已知一个自适应布局的HTML结构如下： 请完成以下响应式要求：1、默认情况，PC电脑（假设视窗都大于等于1000px）访问：两列布局，.parent宽960px且水平居中，左列.side宽300px，右列.main宽650px，列间距10px。2、当用平板（假设视窗都大于400px
2016-12-06 22:31:56
423
转载 getElementsByClassName函数实现获取指定类名的子元素列表
语法如下： var elements = getElementsByClassName(element, names);使用示例如下：如果html元素 对应的DOM节点为example, 那么getElementsByClassName(example, “aaa”); 运行结果为包含id为p1, id为p2的元
2016-12-04 11:41:45
12101
原创 函数fadeout(element)实现了元素的淡出效果（即透明度从1变到0），动画时间为1秒钟。用定时器setInterval实现动画
function fadeout (ele) { var stepLength = 1/50; if (!parseFloat(ele.style.opacity)) { ele.style.opacity = 1; } function step () { if (parseFloat(ele.style.opacity
2016-12-04 11:35:54
4066
转载 利用iframe实现表单的无刷新提交
html lang="en"> head> meta charset="utf-8" /> title>利用iframe进行表单的无刷新提交title> style type="text/css"> .f-hidden { display: none;
2016-12-01 16:42:11
1662
原创 cookie的作用和弊端
cookie作用：1.可以在客户端上保存用户数据，起到简单的缓存和用户身份识别等作用。2.保存用户的登陆状态，用户进行登陆，成功登陆后，服务器生成特定的cookie返回给客户端，客户端下次访问该域名下的任何页面，将该cookie的信息发送给服务器，服务器经过检验，来判断用户是否登陆。3.记录用户的行为。cookie弊端：1.增加流量消耗，每次请求都需要带上c
2016-11-29 21:28:13
13617
原创 Ajax请求GET/POST方法的封装
html lang="en">head> meta charset="UTF-8"> title>GET请求封装title>head>body>script type="text/javascript">// 方法// get(url, options, callback) get是Ajax请求GET方法的封装// 参数// url
2016-11-29 21:17:43
3976
原创 如何实现浏览器兼容版的window.getComputedStyle
window.getComputedStyle能够获取元素的实际样式，但是低版本的ie8及以下不支持，如何在低版本的ie上兼容类似的功能//获取当前样式function getStyle(element, att){ //特性侦测 if(window.getComputedStyle){ //优先使用W3C规范 retur
2016-11-27 11:18:16
5050
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人