1.安装所需依赖需要安装vue-routernaive视图框架npmnpminstallvue-router@4yarnyarnaddvue-router@4npmi-Dnaive-ui2.搭建naive适配框架创建文件夹——存放通用组件在components下创建文件夹common全局配置常用组件在之前创建的global.d.ts中添加Windows的配置interfaceWindow{$loadingBar?:import('naive-ui').LoadingBarProviderInst;$dialog?:import('naive-ui').DialogProviderInst;$m
目录1.Vue3+Vite+TypeScript概述1.1vue3 1.1.1Vue3 概述1.1.2 vue3的现状与发展趋势1.2Vite1.2.1现实问题1.2搭建vite项目1.3TypeScript1.3.1TypeScript定义1.3.2TypeScript基本数据类型 1.3.3TypeScript语法简单介绍2.项目配置简单概述2.1eslint校验代码工具配置2.1.1eslint定义2.1.2eslint安装2.2prettier格式化工具配置2.2.1prettier定义2.2.2prettier安装2.3 stylelint配置2.3.1stylelint定义2.3.
一、全量注册，随用随取1.把项目中所有vue文件注册成异步组件。constapp=createApp(App);functionregisterGlobalAsyncComponents(app:VueApp){constmodules=import.meta.glob('./**/*.vue');for(constpathinmodules){constresult=path.match(/.*\/(.+).vue$/);if(result){constname=result[1];constcomponent=modules[path];app.component(name,defineA
技术：vite+vue3.2+ts+element-plus开发环境没有问题，但是打包后的代码放到正式环境，页面空白...现场的小伙伴发来报错问题 UncaughtSynntaxError：Unexpectedtoken?纳尼，这这这...什么原因，一头雾水用火狐浏览器访问，没有报错，开始狂摆...时间一点点流逝，全网没有找到解决方法....猜测谷歌浏览器版本问题，测试了90版本，页面出来了！用户用的浏览器大部分是65和70的，太老了吧定位到问题就好办了！换关键词搜索“vite低版本浏览器兼容问题”，果然很多人遇到问题问题分析：浏览器内核版本太低，导致用浏览器打开，会出现白屏。该语句是ES6的
目录0.Vue3，Vite，JSX三者的关系JSX介绍在Vue3中使用JSX安装插件（@vitejs/plugin-vue-jsx）新建jsx文件语法补充知识：注意事项0.Vue3，Vite，JSX三者的关系Vue3、Vite和JSX都是现代前端开发中常用的技术。Vue3是一款流行的JavaScript前端框架，它通过提供组件化开发的方式，使得构建复杂的用户界面变得更加容易。Vue3还引入了一些新的功能，如更快的渲染速度、更好的类型支持以及更好的可组合性，使得开发人员可以更加轻松地构建高质量的应用程序。Vite是一个基于现代浏览器原生ES模块导入的开发服务器，旨在提供快速的开发体验和优化的构建
话不多说先贴上仓库地址mini-vite看源码的几个问题封装的方法太多，不知道从哪个方法看起随便一个文件就是一两千行代码，看得头皮发麻不知道该怎么去debug，到底应该在哪个方法里面debug没关系，这些问题在我这都能解决我做了什么移除了vite仓库中的所有注释和其他对于所要学习的vite功能用不上的方法，并为核心方法添加上了注释为需要实现的核心功能画上了简易的思维导图配置了debug功能，直接就能在代码内debug本仓库只实现了vite比较常用的几个功能，后续在vite的学习中，我可能也会不断的往mini-vite里面加上新功能失业程序员待业中，希望大家能给几个star，让我能找工作稍微轻
vite性能优化一、分包策略配置Rollup实现二、gzip压缩配置插件实现三、cdn加速配置插件实现一、分包策略1）浏览器的缓存策略：访问网站时向服务器获取静态资源并缓存起来，如css、js等下次再访问时，如果之前保存的“静态资源”名字没有改变，则不会重新请求2）vite打包文件生成策略：打包时只要代码内容变了，就会生成hash字符完全不同的新文件3）vite分包策略：我们的业务代码时常改变，而依赖不会变化所以把依赖分开打包，以避免多次重新请求资源配置Rollup实现在vite的配置文件中添加“build.rollupOptions.output.manualChunks”配置项实现，如：/
🌻前言本文教程github地址、码云。如果对你有帮助，希望能点个star⭐️⭐️⭐️万分感谢😊😊😊🧱背景不久前我司需要重新部署一个前端项目，由我来负责这个项目的搭建。因为这个项目是需要和app混合开发的h5页面，包括以后可能会做一些运营h5，所以自然不能采用常规的SPA单页面应用架构（因为大部分页面耦合度低，全都塞一个项目里的话，即使打开个纯静态页都要跑起来整个项目，严重影响页面的加载速度）.另外，我们其实已经有混合开发h5项目，采用的gulp工作流，即每个页面都是单独的一个html文件。这种架构的优势很明显，就是体量小，结构清晰等，但是它的缺点也非常明显，例如有些轮子无法使用，组件化、模块化
前端ffmpeg实现视频剪切功能概述环境准备1、安装ffmpeg2、引入并初始化3、引入并初始化功能片段上传文件视轨剪切完整代码剪切组件父组件功能概述组件可传入视频的起止时间,截取起止时间,视频地址和视轨所需参数,在视轨通过滑动鼠标选择被截取的部分,参数以及回调说明如下:参数描述参数名描述startTime视频开始时间，精确到毫秒endTime视频结束时间，精确到毫秒spliterStartTime视频截取开始时间spliterEndTime视频截取结束时间url视频地址ffVideo视轨所需参数回调描述方法名描述回调形参参数描述queryTime截取时间段Array[开始时间，结束时间]su
前端ffmpeg实现视频剪切功能概述环境准备1、安装ffmpeg2、引入并初始化3、引入并初始化功能片段上传文件视轨剪切完整代码剪切组件父组件功能概述组件可传入视频的起止时间,截取起止时间,视频地址和视轨所需参数,在视轨通过滑动鼠标选择被截取的部分,参数以及回调说明如下:参数描述参数名描述startTime视频开始时间，精确到毫秒endTime视频结束时间，精确到毫秒spliterStartTime视频截取开始时间spliterEndTime视频截取结束时间url视频地址ffVideo视轨所需参数回调描述方法名描述回调形参参数描述queryTime截取时间段Array[开始时间，结束时间]su
