vue
Lilio1216
just do it
展开
-
vue常用loader扩展
loader扩展:svg图标 (svg-sprite-loader)icon雪碧图 (webpack-spritesmith)移动自适应布局(flexible) px单位转rem (postcss-px2rem)公共sass文件引入 (sass-resources-loader)原创 2022-04-15 10:50:14 · 622 阅读 · 0 评论 -
cdn方式优化vue项目首页加载慢问题
以cdn方式引入htmlWebpackPlugin中排除的插件包index.html 核心代码: <% if (process.env.NODE_ENV === 'production') { %> <% if (htmlWebpackPlugin.options.cdn.css) { %> <% for(var css of htmlWebpackPlugin.options.cdn.css) { %> <link hre原创 2022-04-15 10:46:49 · 826 阅读 · 0 评论 -
关于遮罩面板出现滚动条的处理
遮罩面板打开时: // 固定body fixedBody() { const scrollTop = document.body.scrollTop || document.documentElement.scrollTop; this.prevBodyCss = document.body.style.cssText; document.body.style.cssText += "position:fixed;width:1原创 2020-12-16 15:30:17 · 203 阅读 · 0 评论 -
日常代码学习记录
实现 Promise.retry,成功后 resolve 结果,失败后重试,尝试超过一定次数才真正的 reject Promise.retry = function(fn, num){ return new Promise(function(resolve, reject){ while(num>0){ try{ const res = await fn resolve(res).原创 2020-11-27 14:21:59 · 125 阅读 · 0 评论 -
vue-hooks的理解与使用
vue的hooks和mixins功能相似,但又比mixins具有以下几个优势:允许hooks间相互传递值组件之间重用状态逻辑明确指出逻辑来自哪里demo源码示意:hook1:import { useData, useMounted } from 'vue-hooks'; export function windowwidth() { const data = useData({ width: 0 }) useMounted(() => { data.原创 2020-09-23 15:42:23 · 6828 阅读 · 0 评论 -
vue2.x解决pc端微信网页白屏问题 ——es6转es5
问题出现原因:低版本浏览器内核不支持es6语法解决方法:结合babel-polyfill插件将es6语法转为es5语法1.npm安装npm install babel-polyfillnpm install es6-promisepackage.json中会出现“babel-polyfill”: “^6.26.0”,“es6-promise”: “^4.1.1”,2.main.js引入import ‘babel-polyfill’import Vue from ‘vue’import原创 2020-09-01 10:55:19 · 1193 阅读 · 1 评论 -
vue2中assets与static的区别
assets与static的区别相同点:资源在html中使用,都是可以的。不同点:使用assets下面的资源,在js中使用的话,路径要经过webpack中file-loader编译,路径不能直接写。assets中的文件会经过webpack打包,重新编译,推荐该方式。而static中的文件,不会经过编译。项目在经过打包后,会生成dist文件夹,static中的文件只是复制一遍而已。简单来说,s...转载 2020-04-20 09:46:35 · 644 阅读 · 0 评论