- 博客(11)
- 收藏
- 关注
RSS订阅原创 实现一个plugin清除代码中的注释
首先我们要知道plugin是一个函数或者是一个包含apply方法的对象接下来我们就自己去写一个plugin去清除代码中的注释,我们要清除bundle.js文件中的注释,所以我们要在bundle,js的内容明确了之后我们采取实施相应的动作.通过官网查询找到emit这个钩子函数其执行时机是webpack即将要往输出目录输出文件时执行,非常符合需求const MyPlugin = { apply(compiler){ compiler.hook.emit.tap('MyPlugin ',compila
2021-08-23 14:34:43
253
原创 实现一个解析md文件的loader
实现一个loader,将md文件转换为html的字符串.首先我们创建一个markdown-loader.js的文件首先我们需要下载marked去解析markdown文件npm i marked每一个webpack-loader都需要导出一个函数,这个函数就是对传进来的资源的一个处理过程,输入就是文件的内容,输出就是次此加工过后的结果.module.exports = sourse => { const html = marked(sourse) //将markdown文件解析出来 re
2021-08-23 12:17:10
591
原创 学习使用通用型脚手架Yoeman
首先需要全局安装Yoemannpm install yo -gYoeman需要搭配特定的Generator才能够使用例如我们现在要生成一个node_modules的项目，那我们就需要一个generator-node模块npm install generator-node -g现在准备工作就做好啦，接下来我们就开始生成第一个带有node-modules的项目，进入到项目的目录执行以下代码yo node执行之后会出现一系列与项目有关的信息让你填写，这个大家按照自己喜好进行填写即可，但建议不要
2021-08-16 22:54:42
248
原创 vue实现图片上传或加载时显示进度条
大家在写项目时肯定会遇到这样的一个需求，在上传文件或者头像过程中用进度条去代替图片上传的过程，这要做的好处是1、上传大的资源时让用户知道资源正在被上传，而不是点击上传以为卡住了没反应而多次点击上传，导致一下子上传多个文件。2、对文件上传做一个性能缓冲的效果，让用户能够看到文件的上传进度从而愿意去等待文件的上传。今天我就用element ui 跟 vue去实现一个图片上传时显示进度条的效果。在HTML5中新增了一个标签progress表示进度，而axios中对progress进行了封装。//封装了一
2021-08-04 00:04:19
4098
原创 vue-router报错Error: Navigation cancelled from “/course“ to “/user“ with a new navigation.
出现这个错误是因为在你的vue-router全局导航守卫中出现了页面跳转到了一个页面之后又重定向到了另一个界面举个小例子：router.beforeEach((to,from,next)=>{ if(to.matched.some(record => record.meta.requiresAuth)){ if(!store.state.user){ //跳转到登陆页面 next({ name:'login', query:
2021-06-27 10:12:07
1845
1
原创 Cookie、sessionStorage、locaStorage的区别
共同点：都是保存在浏览器端，并且是同源的Cookie:cookie数据始终在同源的http请求中携带，即使不需要也会携带过去，即cookie在浏览器和服务器之间来回传递。而seesionStorage和localStorge不会自动把数据发给服务器，金在本地保存。cookie数据还有路径的概念，可以限制cookie只属于某个路径下，存储的大小很小只有4k左右。（key：可以在浏览器和服务器之间来回传递，存储容量只有4k）sessionStorage:仅在当前浏览器窗口关闭前有效，自然也就不可能持久保存
2021-05-10 00:16:20
706
原创 Some selectors are not allowed in component wxss, including tag name selectors, ID selectors
这个警告是因为小程序的组件中不建议用除了class选择器以外的选择器，只要将组件中css的选择器全部改为class选择器就ok啦
2021-05-08 00:26:00
1918
原创 Jest测试框架运行npm test时报错：Test suite failed to run
有可能是import引入组建的问题，es5不支持import引入组件，方法是使用babel把es6转成esnpm install --save-dev babel-plugin-transform-es2015-modules-commonjs在目录下新建.babelrc并添加：{ "plugins": ["transform-es2015-modules-commonjs"]}...
2021-04-10 19:47:07
5755
原创 整理js中offset,client,scroll三大家族
offset家族：offsetTop:距离第一个有定位的父盒子上边的距离。同理，offsetLeft就是距离第一个有定位的父盒子左边的距离。若没有父盒子则以body为准。与style.left不同：1、style.left只能获取行内的2、style.left只能返回带有定位盒子的left，而offsetLeft可以返回没有定位盒子距离左侧的位置3、offsetLeft是只读的，而style.left是可读写的同理,offsetTop等也是一样。offsetHeight:元素本身的高，包括
2021-03-29 20:27:30
143
原创 深入探究js闭包--外加小案例
什么是闭包闭包：能够引用自由变量的函数就叫做闭包。那么什么是自由变量呢？这就涉及到词法作用域以及作用域链的知识了。首先我们来看一个小例子：var name = "James"function foo() { var name = "Kobe"; function people() { console.log(name); // Kobe } people();}foo();我们先来看一下代码的执行过程：1、在 people 函数的函
2021-03-25 00:38:21
146
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人