vue.js
♂♀放纸鸢
这个作者很懒,什么都没留下…
展开
-
vite+vue3搭建的工程如何批量导入store的module
问题的关键是如何引入模块内的文件, const modules = import.meta.glob('./dir/*.js', { eager: true }),一开始没加第二个参数,一直都是动态加载,创建完了store模块才被附上值,然后改为这样的写法。匹配到的文件默认是懒加载的,通过动态导入实现,并会在构建时分离为独立的 chunk。但是globEager的写法已经废弃,强迫症发作一定要改,如下图。src\store文件夹下index.ts。原创 2023-02-14 17:13:21 · 1091 阅读 · 0 评论 -
vite+vue3搭建的工程热更新失效问题
按理说,我们无需要关心这些额外的配置,但是现在确实影响到了我们的开发体验,官网上也没明确描述,仔细想想是什么原因导致了无法热更新的问题,因为刚搭建完工程开发的时候确实是可以热更新的,仔细想了想发现好像是添加完路由出现这个问题的,猜想如果没有路由是不是可以热更新呢,于是在App.vue中修改代码发现确实可以及时热更新,现在可以基本上可以确定是路由问题的啦,各位可以自己试下。),但是过了一段时间后,不过怎么操作页面修改页面都无法及时刷新预览页面,各种纠结。至此,我的问题解决,下面来看其他导致没有热更新的问题。原创 2023-02-14 15:47:41 · 7753 阅读 · 2 评论 -
Vue 跨工程的路由整合
最近在开发过程中,有个需求是在自己开发的应用中(以后简称:主应用)挂载第三方的页面应用(以后简称三方应用),大多数情况下,自己工程引入第三方工程页面用的是iframe嵌套,简单快捷,但是上下文处理、事件交互等方面并不是特别方便,于是就尝试另外的解决方案,当我看到vue的路由守卫,就知道问题该如何解决,大致思路如下:利用路由独享的守卫beforeEnter,在跳转到第三方相关页面前,必定经过beforeEnter路由函数,然后我们在这个路由函数写我们逻辑,区别这个url是我们需要的第三方ur...原创 2022-04-22 10:56:24 · 1418 阅读 · 0 评论 -
vue-router引入组件的几种方式及打包区别
本文使用@vue/cli 5.0.1创建的vue2工程做的验证,预置数据package.json详见最后,其中后三种方式vue路由懒加载的方式。之前有个操作window全局函数的时候,使用直接引入的方式,结果并没有执行,原因是这种方式会把所有引入的组件打包成一个js,而这个组件又异步引入了很多其它组件及服务,导致window函数的顺序调整导致了没有执行,改成异步加载的方式之后,window函数又能正确的执行啦。方式一:普通直接引用的方式import DemoIndex from '../vie原创 2022-03-16 17:53:50 · 3541 阅读 · 1 评论 -
vue工程屏蔽打包legacy文件
我们在进行vue工程(@vue/cli 5.0.1搭建的工程)打包的时候,总是会生成类似539-legacy.48fd84f6.js这种类型文件,这其实兼容低版本浏览器而生成的文件,如果我们的前端工程只在google等现代浏览器版本上跑,打包的时候可以屏蔽build-legacy文件,方式也很简单找到.browserslistrc。后面添加一句话即可not ie <= 11...原创 2022-03-16 15:03:30 · 2769 阅读 · 0 评论 -
类型“Window & typeof globalThis”上不存在属性“gspZc”
在做vue+typescript开发过程,给window对象添加属性并赋值,却发现报错,如类型“Window & typeof globalThis”上不存在属性“gspZc”。原则上,TypeScript 需要开发者做到先声明后使用。这就导致开发者在调用很多原生接口(浏览器、Node.js)或者第三方模块的时候,因为某些全局变量或者对象的方法并没有声明过,导致编译器的类型检查失败。通常情况下,我们给window对象赋值,只需求window.propoerty = 'xxx',但是在此处编译原创 2021-05-19 14:32:08 · 20327 阅读 · 0 评论 -
vue 增删改查初体验
公司最近要使用vue框架开发移动端应用,自己也积极响应公司安排,自己边学边练,制作了一个vue-curd的demo,在此记录下学习内容,希望对你也有所帮助。例子是一个费用报销单报销增删改查,内容有些不是很全,有时间慢慢补充。demo的地址:https://github.com/git407949480/vue-fybxd-mock-curd一、vue脚手架1、全局安装vue-clinpmi-gvue-cli2、vue脚手架搭建vue工程vue脚手架官网vuecre...原创 2020-12-24 19:26:47 · 406 阅读 · 1 评论