- 博客(142)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 关于优化前端页面的加载速度
延迟加载和懒加载：通过延迟加载和懒加载的方式，将页面中不必要的内容延迟到用户需要时再加载，减少页面加载时的数据和资源负担，提高页面响应速度。减少 HTTP 请求次数：通过合并和压缩静态资源、使用 CDN 加速等方式，减少页面加载时的 HTTP 请求次数，提高页面加载速度。优化图片：使用适当的图片格式、压缩图片大小和质量、使用图片懒加载等方式，优化图片的加载和显示效果，减少页面加载时的图片负担。减少 DOM 操作：通过减少 DOM 操作的次数和复杂度，优化页面的渲染和重绘时间，提高页面渲染速度。
2023-07-06 17:26:25
1003
原创 性能优化 ：删除项目中没有引用关系的文件 useless-files-webpack-plugin
一般此类包不需要安装到项目中，减少node_modules体积（以项目实际情况决定-S/-D）最后执行npm run build 会自动生成文件unused-files.json。然后再vue.config.js中配置。默认clean为true会自动删除文件。
2023-06-30 11:19:17
1282
原创 H5 移动端 保存图片到本地 + 图片预览
动态创建A链接，添加download属性和href属性，并触发点击事件。动态创建A链接，添加href属性，并触发点击事件。
2022-12-28 11:44:08
1796
1
原创 fs结合new_node_modules二次开发，有则覆盖node_modules内对应路径的文件
【代码】fs结合new_node_modules二次开发，有则覆盖node_modules内对应路径的文件。
2022-10-10 12:01:03
642
原创 VSCode-让开发更快更方便更安全
1. vscode+eslint+prettier 保存自动按照项目规范格式化 向 2. vscode+工作区+npm link 跨项目协作开发告别修改node_modules/发包烦恼
2022-09-22 17:16:16
370
原创 樱花飘落效果，可附带祝福语~
效果图如下视频地址： https://live.csdn.net/v/201026 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>晴 天</TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Au
2022-04-21 16:28:33
377
原创 windows 代理 本地服务127.0.0.1为任意域名
打开如下路径文件，在hosts文件中新增配置# Copyright (c) 1993-2009 Microsoft Corp.## This is a sample HOSTS file used by Microsoft TCP/IP for Windows.## This file contains the mappings of IP addresses to host names. Each# entry should be kept on an individual line. The
2022-04-12 13:41:35
2083
原创 axios 重试
import axios from 'axios';import { setSessionStorage, getSessionStorage, parseUrl, setCookie, delCookie, removeSessionStorage } from '../../libs/util';import { http_status } from '../../constants
2021-12-01 13:58:45
2211
原创 20个 JavaScript 单行代码 工具类方法
获取浏览器Cookie的值const cookie = name => `; ${document.cookie}`.split(`; ${name}=`).pop().split(';').shift(); cookie('_ga');// Result: "GA1.2.1929736587.1601974046"颜色RGB转十六进制const rgbToHex = (r, g, b) => "#" + ((1 << 24) + (r << 16)
2021-11-24 11:19:15
474
原创 vue-multipage vue模块化 开发 打包
最终实现如下：模块化开发，最大化利用公共组件/资源，又能模块化打包资源，做到不互相影响，能够实现 单独打包部分模块 npm run build moduleName1 打包全部模块 npm run build-all请移步项目资源 vue-multipage...
2021-11-23 17:14:33
641
原创 increase-memory-limit 解决 项目运行内存不足（JS stack trace）
项目运行过程中发现内存不够？<— JS stacktrace —>==== JS stack trace =========================================试试下面的命令吧npm install -g increase-memory-limitincrease-memory-limit
2021-11-03 15:31:18
3334
原创 快速删除 node_modules 只需3秒
如何删除项目中node_modules文件夹？1.直接右键>删除？2.delete？这样删除确实可以，但是需要先关闭所有的项目运行依赖关系。我们可以借助rimraf 来正确移除npm install rimraf -grimraf node_modules
2021-11-03 14:38:59
275
原创 使用ncu 一键升级 package.json 中依赖的版本
npm install -g npm-check-updatesncu -vnpm-check-updatesncu -u
2021-11-02 19:55:44
474
原创 git 删除多余分支 - 远程分支 - 本地分支
删除远程已经不存在的分支查看git remote show origin删除git remote prune origin删除已经没有和远程有关联的本地分支查看git remote show origin对比一下本地哪些分支已经被删除，删除命令git branch -D release/test/v1.0.0...
2021-11-02 11:09:10
330
原创 git submodule 子模块粗解
什么是子模块？ 为什么要使用子模块？ 子模块的用法？什么是子模块？简单理解为，在一个git 项目中，除了主项目以外，还有其他的git依赖仓库，这些依赖仓库往往是以一些工具类方法/配置的方式存在于项目中。如下所示为什么要使用子模块随着公司/业务的发展壮大，往往会分部门/分类型的开展业务或不同的项目组，亦或者是pc端项目和移动端项目。随着项目优化…的需要，都会面临如何抽离会复/共用一些公关资源。已知有两种方法：1.npm包资源2.子模块npm包资源为大家所能广泛接触到的，但是往往.
2021-11-01 20:57:34
111
原创 vue - websocket
<script>export default { data() { path:"https://127.0.0.1:8888/websocket/", ws:{}, }, methods: { //init函数可在页面加载的时候就进行初始化或者根据自己的业务需求在需要打开通讯的时候在进行初始化 init() { // 实例化socket，这里的实例化直接赋值给this.ws是为了后面可以在其它的函数中也能调用websocket方法，例如：this.w
2021-07-10 17:40:45
181
2
原创 CSS使用 REM布局
在入口文件新增自执行函数_initFontSize:function (){ document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px'; },监听窗口变化window.addEventListener('resize',_initFontSize,false);})();UI配置 100px == 1rem页面使用header {.
2021-07-08 17:52:26
243
原创 vue router import 路由懒加载
懒加载：又叫延时加载，即在需要的时候进行加载，随用即载import ：是es6的一个语法标准，如果要兼容浏览器的话必须转化成es5的语法需要新加的配置项1.webpack.base.conf.js2. router.js
2021-06-29 10:07:42
372
原创 git 派生仓库，解决多人开发落后版本问题 提交 步骤
1.派生仓库2. 分别关联两个仓库git remote add origin 远程地址git remote add myorigin 派生仓库地址开发时开发分支往 myorigin 推送3. 先推送到 myorigin（release/test？release/pre） 解决完冲突具体操作可移步 git提交4.提交到 origin新建合并请求...
2021-03-30 10:17:44
2300
原创 使用 js-xss 防御 xss 攻击
xss攻击是很常见的一种攻击方式，下面简单讲一下前端如何防御。讲之前简单涉及一点后端防御的方案：在前后端交互的时候做好特殊符号的转义下面重点是前端使用js-xss防御npm install xss --savemain.js引用import xss from 'xss' Vue.use(xss); Object.defineProperty(Vue.prototype, '$xss', { value: xss })// click事件被过滤3.html 中防御<p
2021-03-29 16:30:56
4627
原创 iview 自定义主题样式
官方地址http://v1.iviewui.com/docs/guide/theme官方提供了两种方法：变量覆盖使用安装工具修改变量覆盖在项目中创建一个my-theme文件夹，在该文件夹中创建index.less文件在index.less文件中写入@import ‘~iview/src/styles/index.less’; 然后将https://github.com/iview/iview/blob/master/src/styles/custom.less 中的默认样式变量复制进来
2021-02-22 10:37:51
1433
转载 分享8个非常实用的Vue自定义指令
在 Vue，除了核心功能默认内置的指令 ( v-model 和 v-show )，Vue 也允许注册自定义指令。它的作用价值在于当开发人员在某些场景下需要对普通 DOM 元素进行操作。Vue 自定义指令有全局注册和局部注册两种方式。先来看看注册全局指令的方式，通过 Vue.directive( id, [definition] ) 方式注册全局指令。然后在入口文件中进行 Vue.use() 调用。批量注册指令，新建 directives/index.js 文件import copy from './c
2020-12-25 10:36:32
191
原创 js让文本中选中字符串高亮显示
整体需要实现效果如下以下可以实现 标记 选中 字符串<html><head><script>var $_text = '';(function(){ document.onmousemove = function(){$_text = document.selection ? document.selection.createRange().text : window.getSelection(); } document.onmouseup
2020-12-14 20:28:30
1229
2
原创 有道 选中翻译 选中文本
<html><head><script>var $_text = '';(function(){ document.onmousemove = function(){$_text = document.selection ? document.selection.createRange().text : window.getSelection(); } document.onmouseup = function(){if($_text!='')al
2020-12-14 09:50:37
613
原创 vue 路由 前进后退
无 history 时 置灰 不可点击<template> <div v-show="showNavigate" class="dt-navigation-box"> <div class="dt-navigation-btn" @click.stop="clickPrev"> <span class="dt-navigation-arrow"> <i class="iconfont">æ.
2020-12-02 13:39:14
1078
原创 原生js获取手机定位信息 geolocation
function Location() {};Location.prototype.getLocation = function (callback) { let options = { enableHighAccuracy: true, maximumAge: 1000 }; this.callback = Object.prototype.toString.call(callback) == "[object Function]" ? callback :
2020-12-02 11:43:54
2611
原创 git 操作流 适用于部分公司的 开发 提测 预发 生产
git 操作流tips：不同公司的git流可能不一样，但大同小异操作方法都可以这么执行，个人见解。分支简介 master pre test release开发 1. 仓库 基于master分支 创建新分支 release-模块/v版本号 （release-wdqy/v1.0.1） 2. 本地 git fetch -p 3. 切换到刚才新建的分支 release-wdqy/v1.0.1 4. 同步本地-远程代码（或者手动git pull/git merge） 5. 开始开发
2020-07-24 11:27:24
369
原创 VsCode 暂存报错 git add -A -- xxx is outside repository
问题：VsCode “暂存更改"失败，报错"fatal git add -A – e:\x…\xxx is outside repository”Git 版本：git version 2.10.0.windows.1更新后：git version 2.27.0.windows.1解决：首先我仔细检查了 “.gitignore”文件，文件并没有添加到忽略名单问题原因竟然是：“Git”版本过低…更新Git到最新版，解决！...
2020-06-17 10:15:52
1991
1
原创 css 文本 两端对齐
display: inline-block; text-align: justify; vertical-align: top; text-align-last: justify;效果图如下
2020-06-02 09:34:09
250
原创 移动端h5 meta标签常用配置
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/><meta name="apple-mobile-web-app-capable" content="yes"/> // 删除苹果默认的工具栏和菜单栏<meta name="apple-mobile-web-app-status-bar-style" content="black"/> // 设置
2020-05-30 18:20:40
657
原创 vue pages 多入口项目 + chainWebpack 全局引用缩写
项目结构├── node_modules # 项目依赖包目录├── build # 项目 webpack 功能目录├── config # 项目配置项文件夹├── src # 前端资源目录│ ├── images # 图片目录│ ├── components # 公共组件目录│
2020-05-25 16:25:30
1409
原创 前端面试进阶（vue + es6 + js）
以下内容仅为个人见解，如有错误欢迎指正~vue双向绑定原理： vue.js 则是采用数据劫持结合发布者-订阅者模式的方式， 通过Object.defineProperty()来劫持各个属性的setter，getter， 在数据变动时发布消息给订阅者，触发相应的监听回调。延伸： * Object.defineProperty() 是ES5 中一个无法 shim 的特性， 这也就是 Vue 不支持 IE8 以及更低版本浏览器的原因。 * Objec
2020-05-23 15:08:25
1118
1
原创 Promise--异步请求
先执行getData1，在执行getData2let getData1=new Promise(function(resolve,reject){ $.ajax({ type:"get", url:".../getData1", success:function(data){ if(data.state=="200"){ resolve(data.data) // 在异步操作成功时调用
2020-05-23 09:46:26
498
原创 把数组分割为二维数组
附代码groupList(array, subGroupLength) { let index = 0; let newArray = []; while(index < array.length) { newArray.push(array.slice(index, index += subGroupLength));} return newArray;}
2020-05-18 16:59:02
1362
原创 反向面试 （面试官：你还有什么想问的吗？）
职责On-call (电话值班)的计划或者规定是什么？值班或者遇到问题加班时候有加班费吗？我的日常工作是什么？团队里面初级和高级工程师的比例是多少？（有计划改变吗）入职培训会是什么样的？自己单独的开发活动和按部就班工作的比例大概是怎样的？每天预期/核心工作时间是多少小时？在你看来，这个工作做到什么程度算成功？我入职的岗位是新增还是接替之前离职的同事？(是否有技术债需要还)？(zh)...
2020-04-27 10:11:35
338
原创 vue中的路由-前置守卫：修改网页标题，后置守卫：设置网页加载状态
// 全局前置守卫router.beforeEach((to: any, from: any, next: any) => { LoadingBar.start(); // 网页加载状态 console.log(to, from); if (to.meta.title) { document.title = to.meta.title; ...
2020-04-26 09:48:02
587
原创 本地文件记录恢复 文件恢复 vscode插件 idea功能
今天给大家安利一款文件恢复插件rxt，每次ctrl+s保存的文件都会生成时间戳，麻麻再也不用担心误删了vscode 安装插件 Local Historyidea 内置的有 Local History对于vscode 用户如果没装的话建议先装上，有备无患，不要用时空流泪...
2020-04-23 10:17:36
1435
2
省市区三级联动数据 json vue iview vant ele antd
2020-06-10
vue+cli+ts项目实战.rar
2020-04-02
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人