道招
Javascript去除内容格式并匹配目标格式粘贴
先说下需求: 支持将复制的文本内容粘贴(包括覆盖)contenteditable为true的目标div里面 复制内容的文本如果有多行,粘贴后需要保留它们直接的换行效果 如果覆盖的目标div有多行文字,粘贴内容需要匹配第一处文字的格式(样式都是以内联形式写入style中) 比如我们想将复制的文字,覆盖粘贴下面的目标div中,文字保留换行后,格式(字体、字号、颜色等)应该跟第
vue内置组件keep-alive源码解析
很简单,我们直接看vue的源码即可。 keep-alive 组件支持三个属性。 props: { include: patternTypes, exclude: patternTypes, max: [String, Number] }, 其中 patternTypes = [String, RegExp, Array]; 组件在 created 周期时初
以webpack为例来看微内核架构
微内核系统一般分为两个部分—— 核心系统 和 插件系统 ,这样就提供了很好的灵活性和可扩展性。 核心系统是最小可运行的模块,它提供的是通用逻辑(比如Tapable),而插件系统这是些具体的逻辑(比如HtmlWebpackPlugin插件)。 比如系统怎么跑起来,插件之间怎么通信等模块都属于核心系统里面,让系统更加丰富多彩就是插件系统了。 插件之间可以相互独立,也可以有依赖,比如webpack的M
道招网终于完成改版了
这个清明节放假三天,由于疫情还没有完全退去,大家还不太适合大规模聚集,更重要的是我本来也爱宅着不动。放假前就决定这三天干点正事,于是就想起把之前立的flag扶一下,把道招网的vue服务端渲染版彻底上线,之前的flag就是把将道招网的wordpress只作为后台管理用,前端页面改用自己更加得心应手的vue,2019年下半年就把道招网常用的几个接口的graphql接口写好了,但是当时由于服务端渲染后
webpack笔记——在html-webpack-plugin插件中提供给其它插件是使用的hooks
最近在这段时间刚好在温故下webpack源码,webpack5都出来了,4还不再学习下? 这次顺便学习下webpack的常用插件html-webpack-plugin。 发现这个插件里面还额外加入了自己的hooks,方便其它插件来实现自己的功能,不得不说作者真是个好人。 部分代码如下 // node_modules/html-webpack-plugin/index.js app(co
从vuecli3学习webpack记录(四)vue是怎么进行默认配置的
在我们讲到 从vuecli3学习webpack记录(一)vue-cli-serve机制 vue cli3中在commands文件夹里面的是调用api.registerCommand方法,在config文件夹里面的(teserOptions.js和html除外)是调用api.chainWebpack方法,该方法会将传得的参数(该参数是一个方法)push到this.service.webp
webpack笔记——hook执行时call的是什么
我们一般使用的插件都是Hook子类,比如SyncHook,没有复杂的重写基类Hook的compile方法 先看Hook基类 // node_module/tapable/Hook.js class Hook { constructor(args) { if (!Array.isArray(args)) args = []; this._args =
前端使用karma+mocha+babel+istanbul进行单元测试覆盖
先看看项目结构 这是一个vue项目,其中project位于当前项目的根目录下。 废话不多说,先上配置文件 karma.conf.js const webpackConfig = require('./build/webpack.test.conf'); module.exports = function karmaConfig (config) { config.set({
webpack引入UMD风格JS报错Cannot set property xxx of undefined
我们在项目(比如vue项目)中可能会引入一些umd风格的js库,比如wangEditor,这类的库一般会这么写 (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : typeof def
vue-cli设置css不生效
我们有的项目使用的是老的vue-cli脚手架生成的,今天想写点东西,发现.vue文件里面 style 里面写的样式都不生效了,很自然就想到是不是loader的问题。 在这种项目的webpack.base.config.js一般设置loader的 rules: [ ...(config.dev.useEslint ? [createLintingRule()] : []),
关注道招网公众帐号
道招开发者二群