- 博客(23)
- 收藏
- 关注
RSS订阅转载 【转载】如何为团队定制自己的 Node.js 框架？（基于 EggJS） - 天猪的文章 - 知乎
最近在研究egg，准备新开一个中间层的项目，看到天猪这篇文章，有一些实践和讲解能让人豁然开朗，所以忍不住转载分享一下。如何为团队定制自己的 Node.js 框架？（基于 EggJS） - 天猪的文章 - 知乎天猪：eggjs 核心开发者。...
2020-09-30 11:29:47
255
原创 《Webpack实战：入门、进阶与调优》知识点整理
这是最近看了Webpack实战：入门、进阶与调优后，整理的书籍相关知识点，方便复习与查找，分享出来，若对其中的一些知识有兴趣，可以去参阅原书，已经注明页码。
2020-09-15 21:04:46
679
原创 js函数式编程基础要点总结
最近在看js的函数式编程，觉得很酷，此文是对一些知识的脉络梳理总结，主要是为了方便自己理解，并非原创知识。会在文末贴出参看文章链接。文中主要提到10点，分别是：高阶函数、纯函数、PointFree、函数合成、函数柯里化、范畴、函子（Functor）、Either、Applicative Functor、IO、Monad。最后会列举一个示例。一、高阶函数：函数式编程的基础都会用到高阶函数，高阶函数是一个接收函数作为参数或将函数作为输出返回的函数。例如：Array.prototype.maplet a
2020-09-09 20:02:06
273
原创 优化js中的if/else结构
需求： 经常在代码中会有各种条件判断，导致if/else使用过多，不仅阅读麻烦，对于新加的条件，还不好扩展，文中列举了7中优化方案，可以根据实际代码环境选用。文中并没有列举switch，是因为switch结构使用上与is/else并无区别。1、提前return，可以将判断层级拉平let animal = 'cat'if (animal !== 'dog') { if (animal === 'cat') { console.log('测试') }}let animal = 'ca
2020-09-07 10:41:35
1114
原创 electron截取桌面应用的图片
需求： 需要截取桌面打开的相关应用的图片。方法：截图我们采用的api是electron的desktopCapturer，通过这个api我们可以拿到桌面打开的各种应用的缩略图，最终可以拿到一个electron的nativeImage格式的图片，这种格式具有toDataURL()、crop(rect)、resize(options)等各种方法，可以对其根据需求进行处理。具体代码如下： // 截图方法 shotClick() { desktopCapturer.getSources(
2020-09-01 11:21:19
1090
原创 vue+Vue CLI Plugin Electron Builder开发electron应用
文中主要解决的问题：1、electron下载缓慢。2、vue add electron-builder执行失败。3、打包的时候某些包下载不下来。一、创建一个vue项目npm create vueTest具体操作和创建vue项目一样，不详细展开。二、有了vue项目之后需要安装Vue CLI Plugin Electron Builder，但是由于网络原因，建议先在项目安装electron-chromedriver与electron1、npm install --save-dev electron
2020-08-18 19:42:00
3301
7
原创 html2canvas保存图片模糊的问题
目标：将html页面元素转成base64格式的图片。问题：最初直接用的html2canvas官网的最新版代码，配置之后保存的图片模糊。解决方案：采用增加了dpi和scale两个选项之后的html2canvas源码，配置这两个参数能得到清晰的图片。源码地址：https://github.com/eKoopmans/html2canvas/tree/develop/dist代码配置：// testImgs是需要转换成图片的页面元素html2canvas(document.getElementById
2020-08-15 11:56:34
1139
原创 electron-vue打开文件夹选中多张图片发送给后台的实现
目标： 后台提供了一个上传图片的接口，如果要同时上传多张图片，需要将图片转换成base64，然后用数组格式进行上传。文中用到的基本功能：1、electron的打开文件夹功能。相关api是dialog2、node的fs模块。3、element-ui的图片预览组件。组件是el-image具体流程：1、上传图集按钮<el-button size="mini" type="warning" @click="uploadClick">上传图集</el-button>2、打开文
2020-08-05 16:17:27
1190
原创 css性能优化总结
整理一下css优化相关的知识，看到后会慢慢补充。主要从以下三个方面进行总结：1、减少加载页面时候的数据传输量。2、提高页面渲染速度。3、css代码的可维护性。一、减少加载页面时候的数据传输量为了减少数据传输量，主要是减少css代码的体积，主要整理了以下几点：1、压缩css文件2、合并属性，样式复用，减少代码量3、移除空的css规则4、不声明多余的css样式，使用继承规则减少代码量5、关于display：display:inline后不应该再使用width、height、margin、padd
2020-08-04 20:39:59
385
原创 webpack配置项目—Vue项目
分享一个最近测试搭建的webpack的vue项目，完成最基本的功能配置。一、搭建基本骨架npm init 初始化npm install webpack webpack-cli --save-dev 安装基本组件根目录创建文件：index.html ，src/main.js ，src/app.vue ，webpack.config.base.js，webpack.config.dev.js，webpack.config.prod.js最终基本目录如下：二、各文件内容及作用1、src
2020-07-12 14:08:31
370
原创 webpack配置项目-H5页面
起源：因为最近一直用jQuery写H5页面，觉得挺无聊的，想着用webpack配置一个项目来开发H5页面，就可以使用NPM无穷无尽的包了， 然后就可以随便浪了。基本步骤：一、初始化基本环境npm init 这个不多说，自己设置。npm install webpack webpack-cli --save-dev二、建index.html index.js webpack.config.js 文件，具体位置如下1、index.html 文件<!DOCTYPE html><
2020-07-06 11:24:35
1148
原创 vscode用Prettier格式化代码，让vue项目统一代码规范
问题：因为最近和同事合作一个基于vue的项目，但是每个人的习惯不一样，和本地IDE的格式规范也不一样，往往造成提交的代码格式不一，十分不方便目标：基于vue，让代码的格式与每个人的IDE格式配置无关，保存能自动格式化代码，且保持统一风格。准备工作：1、Prettier插件：在vscode中装Prettier插件。2、将vscode配置成保存自动格式化。打开设置，点击代码视图，加入如下代码。{ "editor.formatOnSave": true}用vue创建项目，在这个示例中是采用vu
2020-06-24 16:51:12
2680
原创 怎么把火狐浏览器整成自己喜欢的风格
不多说，先上图：偶然发现了火狐可以通过Firefox Color扩展自己配置顶部标签栏的颜色，那只能掏出最喜欢的夜店粉整它一下了，然后再配合stylus扩展，就可以整出自己喜欢的风格了。一、修改顶部书签栏颜色1、在顶部搜索栏输入about:addons可以进到火狐的扩展页面，然后搜索Firefox Color组件，没有就点击添加到Firefox。2、有了Firefox Color组件后，在扩展的主题选项里面，拉到最下方，会有一个使用Firefox Color打造自己的主题的链接。当然，如果不喜欢自己
2020-06-13 15:30:52
1242
2
原创 css animation浏览器兼容性
最后再整理一个css animation的兼容性。查询兼容性网站：Can I use总结：IE10以下不支持，要支持更多的浏览器版本，记得加相关浏览器前缀。
2020-05-09 11:49:02
1740
原创 css常用布局兼容性
css常用布局兼容性因为平常布局用的多，所以简单总结一下常用布局的兼容性。查询兼容性网站： Can I use总结：1、若pc端兼容要求高，应不选用flex布局。2、盒子模型和position支持良好，但在选用一些不常用api的时候需要注意兼容问题。...
2020-05-09 10:53:23
432
原创 css各版本选择器兼容性总结
css各版本选择器兼容性总结查询兼容性网站：Can I use总结：css1的各种选择器已经被各种浏览器完全支持。css2.1的选择器对IE6的支持不好。如果想兼容IE6-8，那么就不要用css3的选择器。虽然火狐和Safari的很早的版本对css3的选择器支持不好，但是那已经是很老的版本了。...
2020-05-08 09:59:52
535
转载 H5页面适配移动端
基本概念基本概念来自于网上的博文，非原创，主要用于收藏，会在文末附上链接。在项目应用中目录中总结了日常用到过的适配方法。三个基本概念布局视口 ：布局视口是网页布局的基准窗口，在PC浏览器上，布局视口就等于当前浏览器的窗口大小（不包括borders 、margins、滚动条）。在移动端，布局视口被赋予一个默认值，大部分为980px，这保证PC的网页可以在手机浏览器上呈现，但是非常小，用户可...
2020-05-07 10:36:32
1412
原创 学习做一个基于vue-cli的组件库（下篇）
基于vue-cli4的ui组件库，上篇：如何做一个初步的组件。下篇：编写说明文档及页面优化。接上篇，开工。GitHub源码地址：https://github.com/sq-github/sq-uiGitHub预览地址：https://sq-github.github.io/sq-ui/dist五、添加markdown说明文本1、删除app.vue原有的app.vue内容，及其他一些...
2020-05-06 15:33:43
619
原创 学习做一个基于vue-cli的组件库（上篇）
基于vue-cli4的ui组件库，先贴个最终效果吧，步骤有点多，准备分上下篇，上篇：如何做一个初步的组件。下篇：编写说明文档及页面优化。开工。GitHub源码地址：https://github.com/sq-github/sq-uiGitHub预览地址：https://sq-github.github.io/sq-ui/dist一、组件库是基于vue-cli框架的的，用vue-cl...
2020-05-06 15:26:02
521
原创 一种优化递归算法的方法(javascript)
看书的时候看到了这个比较酷的方法，分享一下。一、问题描述：代码如下，我们以计算阶乘（factorial）为例，当重复调用factorial(9)，factorial(8)，factorial(7)的时候，显然在factorial(9)已经计算了后面两个的值，factorial(8)和factorial(7)算是重复计算。目标就是对此进行优化。function factorial(n) {...
2020-05-06 15:17:19
209
原创 CSSmargin击穿问题（子元素margin-top会影响父元素）
最近写一个H5页面的时候发现了这个被忽视的问题，一时没想到什么原因，搜了半天，记录一下，方便他人踩坑。唉，有些东西不用就忘。一、问题描述<div class="container"> <div class="children">子元素</div></div>.container { background-color: r...
2020-05-06 15:13:22
552
原创 vue的nuxt框架中使用vue-video-player
一、基本需求：使用nuxt框架，需要在移动端网页中播放视频。 二、文中解决的基本问题： 1、vue-video-player在nuxt中怎么使用。 2、由于为了适配移动端，使用了postcss-px2rem插件，如何解决vue-video-player的样式与postcss-px2rem插件的冲突。 3、如何播放m3u8的视频。 三、解决方案：...
2020-05-06 15:04:32
2993
7
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人