![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 73
Emperor灬fly
今天又是充满希望的一天
展开
-
嗨~那个少年,快来做一个跨vue2和vue3的组件库
嗨,那个少年,跨vue2和vue3的组件库搭建方案,你值得拥有!!!原创 2022-12-17 17:55:07 · 1065 阅读 · 2 评论 -
如何使用vue-cli,做vue3.0的服务端渲染(ssr)
上个月有网友看我之前用vite搭建的vue3.0服务端渲染demo之后,就在评论区问我有没有不是vite的vue3.0服务端渲染教程。闻此,我心中窃喜(ps:兄弟们来活了),沉睡了很长时间的我,终于又开始鼓捣了。记得上一篇vite的文章是去年3月份发布的,一晃居然一年过去了,不由得感叹光阴似箭,日月如梭啊。在去年调研vite的时候,其实刚开始是调研的webpack和vue-cli去做构建工具,但是当时这方面的生态太差了,一些关键的地方进行不下去,无奈只能弃之,转用当时风头正盛的大明星-vite,不得不说v原创 2022-03-23 16:38:42 · 3348 阅读 · 0 评论 -
解决vue老项目出现的{{}}问题
前端时间,又双叒叕接手了公司一个老项目。它是一个用vue最刀耕火种写法的搞的一个多页面项目,里面还穿插着jquery等各种写法,百花齐放。以史为镜,可以知兴替;以人为镜,可以明得失以敬仰之心重读老项目,里面其实有很多前人当时先进的理念,...原创 2022-02-10 16:57:55 · 1238 阅读 · 0 评论 -
Custom directive is missing corresponding SSR transform and will be ignored
最近在尝试做vue3.0的服务端渲染,自己也写了一些相关的插件,其中用到一些指令插件的时候,发现在服务端渲染解析的时候会报错,是缺少transform方法导致的,后面经过大佬指点,发现自定义指令的服务端transform方法是要自定义的,不然运行打包都会报Custom directive is missing corresponding SSR transform and will be ignored。解决方案:本人用的是vite,所以解法如下,在配置文件中传入自定义指令的服务端transform。原创 2021-02-25 16:03:46 · 1880 阅读 · 0 评论 -
基于vue3.0封装的虚拟滚动插件-vue-virtual-scroller
众所周知,当节点达到一定数量的时候,前端就会产生很大的性能问题,那么我们应该怎么来改善这种局面呢,没错,就是所谓的虚拟滚动,其实就是几个节点在滚动的时候移来移去,非常的乏味。其实很早之前就已经研究过,记得当时谷歌就已经有提出创建可回收节点的api,这么多年过去了,也没有去关注有没有去继续推动了,大概就是会有个原生的createCycleElement这种的api出现,尝试过在孤高度不一致的列表里,位置计算会有问题。直至vue3.0正式发布,又开始了造轮子的道路,于是vue-virtual-scrolle原创 2021-02-24 17:57:47 · 3943 阅读 · 6 评论 -
如何使用vite,做vue3.0的服务端渲染(ssr)
新春伊始,想必在座的各位都正在嗷嗷待哺的等待需求中(ps:划水摸鱼),不好意思,理直气壮的说我也是。几天鱼摸下来,心里也不是滋味,看着身边的同学一个个每天都在学这学那,搞得我也不是很好意思。于是趁着现在各种完全体的方案和框架还没出来之前,那我们把vue3.0的服务端搭一搭吧,自己写写还是很有意思的。好了,废话就先到此,开局调研了基于webpack和vue-cli去搭,途中碰到了一些问题就放弃了,由于尤大最近很痴迷于vite,vue-cli相关的生态也有些滞后。于是反手就一手vite搞起,看看到底有什么魔力原创 2021-02-24 17:33:08 · 11626 阅读 · 29 评论 -
基于vue的音频audio播放+管理器(vue-audio)
全局的微信小程序音视频管理器,有需求的朋友请见上上篇。自从弄了小程序的音频播放器后,就一直在想,要不h5也弄一个吧,反正该来的都会来的,你永远不知道明天跟需求,哪一个会先到。平时造造轮子,已备不时之需,好,那么接下来我们来捋一捋这个需求。需求:传个地址进去给我播出声来。(???这不是基本需求吗?)去掉audio标签原有样式。(实在是石器时期的造物)有进度条,支持拖拽,点击跳转播放。(这才是正常需求啊)保证全局只有原创 2020-07-30 18:00:28 · 3632 阅读 · 9 评论 -
微信小程序,分享如何封装一个全局支持暂停,拖动等各类操作的音视频等多媒体管理器
不知不觉埋头于业务已许久,距离上一篇分享应该很久很久以前,具体何时,已无从知晓。慢慢的开始觉得锅有点热,感觉呼吸有点困难,温水里面的青蛙趁着腿还没完全麻木的时候,也想着开始重拾旧梦,稍微往上蹬蹬,好了,废话就不多提了,时不时的低头总结某段时间的成果大过于做10个新项目,下面就开始慢慢的总结之路吧!(ps:其实是往事不堪回首) 前置背景介绍:公原创 2020-07-13 15:45:30 · 695 阅读 · 0 评论 -
超智能vue图片懒加载之指令化管理(vue-img-lazy-load)
分享一个基于vue的图片懒加载的指令插件,使用起来也是极其简易。 图片的懒加载,可以减少首页首次加载的数量,减少服务器的压力,优化用户体验,有点就不多提了,所以在app里使用图片懒加载是很必要的。安装npm install vue-images-lazy-load --save使用(最开始的名字有冲突,所以使用了vue-images-lazy-loa...原创 2019-02-25 23:22:41 · 2071 阅读 · 0 评论 -
分享vue项目的服务端渲染学习过程
最近抽出了点时间,弄了下vue ssr项目,至于ssr的优点就不多提了。学习路线参照了官方实例,有兴趣的同学可以去看下。 我的项目地址,主要使用了ssr+typescript+vuex+vue-cli 2.0,有兴趣的同学,欢迎start。那么就先讲下前期的打包配置吧,本地开发,也就是所谓的dev,需要热更新等一系列便于调试的插件,所以需要区分webpack的配置。代码...原创 2019-01-08 23:42:38 · 1503 阅读 · 0 评论 -
如何在node和vue以axios作为交互的项目中使用cookie或者set-cookie
最近在用vue+node+mysql重构项目,前端用的vue+typescript写的,后端用的express框架,没有用太多的插件,用原始撸的。 项目地址https://github.com/Vitaminaq/node-mysql 欢迎交流。 刚好有个登陆页面,为了保存用户信息,必须得使用token。之前的思维一直局限在,用户登陆时,生成token,并用放在data...原创 2018-11-02 23:36:07 · 6307 阅读 · 0 评论 -
用指令管理vue滚动状态以及滚动条复原,让你为所欲为。
滚动状态管理以及滚动条复原是困扰了我很久的问题,想必也有和我有同样感受的同学,比如首页跳详情页,以及各详情页滚动条的管理,让人感觉很难受,那么如何来简化它呢?那么就使用这款神奇的插件vue-rescroll吧,让你疯狂飙车,为所欲为。 用了指令就不可以用keep-alive来进行缓存,因为那样自定义指令里的钩子函数不会触发,自然指令就失效了,一般的滚动插件配合vuex...原创 2018-09-12 22:10:39 · 2413 阅读 · 0 评论 -
关于vue-cli项目npm run build后,index.html无法在浏览器打开
一 般打包的时候命令行会出现如下错误提示:然后去dist文件夹运行index.html。在浏览器里会发生如下错误提示:解决的措施为: 先在config/index.js把原本是./改成/,然后再去bulid文件夹的build.js里,把命令行提示那段console.log给删除掉,或者注释掉,再次打包就可以正常运行原创 2017-10-03 18:08:33 · 12731 阅读 · 0 评论 -
vue-cli+webpack前端使用后台接口跨域问题的多种解决及其原理和产生原因
解决方式: 基于vue-cli 2.0版本,下载好工程后,找到config文件夹里的index.js文件,然后就是把上图的target改成你的接口地址前面的那部分就好了,底下的^/api就是把前面那些替代成空字符串,接口就写替代的后面那部分路由地址就好了,不过我推荐不要用‘/api’还是用‘’空字符串代替,这样你部署到服务器的时候路由才不会出问题,不然有可能会出现问...原创 2017-09-17 13:46:16 · 8390 阅读 · 0 评论 -
关于新手入坑vue,页面跳转样式错位刷新又好了的情况
在项目开始的时候,一股脑的热情把所有的代码都码好了,然后就开始测试各模块的功能。在页面跳转的时候总有几个页面,在跳到该页面时样式全错位了,但是刷新一下就又好。于是就打开浏览器查看在页面跳转时样式的变化,我发现有些页面,在跳转时页面的样式并没有加载,而是沿用了前一个页面的,或者前面已经加载过页面的样式。一开始觉得很奇怪,后来想了想,这是个单页面应用。是不是样式的id 或者 class ...原创 2017-09-15 11:13:46 · 14001 阅读 · 4 评论 -
vue-cli项目以及普通静态网页如何部署到github pages
首先我们登录github,进入项目仓库,点击setting,找到github pages栏的source,点开,如下图:第一个的意思是,建立一个gh-pages分支,第二个是直接选择主分支部署到github pages,第三个是主分支下的docs文件夹。能成功部署的条件是必须有个index,html作为入口,也就是说无论用哪种方式,都要有个index.html在主目录。静态网页的话就可原创 2017-10-04 16:22:24 · 4675 阅读 · 1 评论 -
vue项目如何使页面后退不刷新,且还原滚动条位置
新指令化管理滚动状态地址https://blog.csdn.net/theoneEmperor/article/details/82669022(欢迎star),滚动条保存以及回退只需要一条指令,让你为所欲为。 最近学了下node,自己用vue和node弄了个项目。在首页跳到详情页,然后从详情页再跳回来的时候,发现总是要刷新页面,这样对用户操作很不友好,意味着用户不...原创 2018-04-03 17:01:31 · 7395 阅读 · 0 评论 -
如何改装element-ui表格,使之拥有增加和删除功能成为动态表格
最近项目需要使用一个动态表格,使之拥有增加删除以及大表单的保存功能,界面框架定的是element-ui,仔细找了找,并没有现成的动态表格可以使用,没办法,只能开启改装之路。我的思路是这样的,就是在拿到后台数据时,在末尾在加上一个标记空数组,使之成为增加框,就可以了。这样就需要一个初始化的标记空数组,在没有数据的时候也会出现增加框。通过v-if以及v-else就可以实现基本的判断,具体...原创 2018-05-03 10:28:12 · 9196 阅读 · 0 评论 -
分享vue + vuex + typescript的一次项目代码重写
俗话说一个项目,用代码重写十次,每次肯定收益匪浅。后续还会持续重构ssr等。在vue里使用ts,一般分为两种情况: 在vue-cli 3.0以下的老项目中。 在最新的vue-cli 3.0中。vue-cli 3.0在最新的vue-cli 3.0中使用typescript,可以说是非常方便了,因为添加了对ts的支持,用vue create 项目时,选第二项自定义...原创 2018-07-19 23:38:18 · 7896 阅读 · 2 评论