Unocss简单使用首先初始化一个vite项目使用pnpm安装pnpmcreateviteunocss-demo----templatevue-ts使用npm安装npminitvite@latestmy-vue-app----templatevue使用yarnyarncreatevitemy-vue-app--templatevue下载Unocss依赖安装unocss和三个预设，第一个是工具类预设，第二个是属性化模式支持，第三个是icon支持pnpmi-Dunocss@unocss/preset-uno@unocss/preset-attributify@unocss/preset-icons
什么是gzip压缩当前端资源过大时，服务器请求资源会比较慢。前端可以将资源通过Gzip压缩使文件体积减少大概60%左右，压缩后的文件，通过后端简单处理，浏览器可以将其正常解析出来。如果浏览器的请求头中包含content-encoding:gzip，即证明浏览器支持该属性。gzip的使用前端压缩前端使用gzip压缩代码很容易，通过插件即可。vue-cli中使用compression-webpack-plugin插件。constcompressionWebpackPlugin=require("compression-webpack-plugin");module.exports={configu
一、npx与npm区别npm都很熟，可是与npm如此相似的npx是干嘛的呢？我们为甚要介绍npx?由于uni-app官方提供创建命令使用的是npx，所以我们先来了解下npx是干什么的？它与npm的区别。npx是npm的高级版本，它从npmv5.2版本开始引入的，与npm绑定在一起，无需额外安装，具有更大的功能。npx是npmexec的别名，如果没有时，可以手动：npminstall-gnpx进行安装。区别：npm只能通过package.json里定义然后执行命令，npx可以直接执行node_module包中的命令。npx可以指定node、命令的版本，解决不同项目使用不同版本的命令问题。临时安装
一、npx与npm区别npm都很熟，可是与npm如此相似的npx是干嘛的呢？我们为甚要介绍npx?由于uni-app官方提供创建命令使用的是npx，所以我们先来了解下npx是干什么的？它与npm的区别。npx是npm的高级版本，它从npmv5.2版本开始引入的，与npm绑定在一起，无需额外安装，具有更大的功能。npx是npmexec的别名，如果没有时，可以手动：npminstall-gnpx进行安装。区别：npm只能通过package.json里定义然后执行命令，npx可以直接执行node_module包中的命令。npx可以指定node、命令的版本，解决不同项目使用不同版本的命令问题。临时安装
Vite配置代理Proxy1.跨域问题2.跨域的常用解决方案3.代理如何来解决跨域问题4.Vite中配置代理4.1.vite.config.ts配置4.2.在配置中使用环境变量1.跨域问题跨域问题：浏览器从一个网页去请求另一个资源时，域名、端口、协议任一不同，都是跨域。2.跨域的常用解决方案jsonp：利用script标签可跨域的特点，在跨域脚本中可以直接回调当前脚本的函数。cors：服务器设置http响应头中的Access-Control-Allow-Origin值，解除跨域限制。Node代理nginx反向代理vue中配置proxy代理就是利用了Node代理，下面就来讲讲如何在Vite中配置
1.安装electron,通过npm下载electron需要全局安装npmi-selectron-D2.在和src同级的目录中新建一个electron文件夹，在文件夹中新建main.js3.修改package.json文件 1.删掉type这个字段，不然会报错 2.然后加上"main":"electron/main.js", 3.在scripts字段中加入启动electron的命令：如下图4.在刚才创建的electronx文件夹下main.js中加入以下代码//控制应用生命周期和创建原生浏览器窗口的模组const{app,BrowserWindow,Menu}=require('electro
项目(Vue3)：Vite+vueRouter+ts需求描述：登录后跳转情况：①项目中有些页面是需要登录后才可以访问的，如果没有登录的情况下，访问该页面会自动跳转到登录页，完成登录操作后，需要再次返回到该页面②如果直接访问登录页，登录后跳转到首页页面访问限制：路由守卫访问页面时，进行限制，除了部分不需要登录就可以访问的页面，其他需要登录才可以访问的页面，未登录时访问时，跳转到登录页在main.ts文件中添加全局前置守卫：router.beforeEach1.找到“router”文件夹下的“index.ts”文件，在路由文件中配置路由信息，设置meta下的requiresAuth字段值，如果需要
提示：找不到模块“vue-router”。你的意思是要将"moduleResolution"选项设置为"node"，还是要将别名添加到"paths"选项中?ts(2792)解决方案一：查看官方文档：https://www.tslang.cn/docs/handbook/migrating-from-javascript.html获取声明文件如果你开始做转换到TypeScript导入，你可能会遇到Cannotfindmodule'foo'.这样的错误。问题出在没有声明文件来描述你的代码库。幸运的是这非常简单。如果TypeScript报怨像是没有lodash包，那你只需这样做npminstall-
简言我们来学习配置下vite.config.ts。介绍Vite是一种新型前端构建工具，能够显著提升前端开发体验。它主要由两部分组成：一个开发服务器，它基于原生ES模块提供了丰富的内建功能，如速度快到惊人的模块热更新（HMR）。一套构建指令，它使用Rollup打包你的代码，并且它是预配置的，可输出用于生产环境的高度优化过的静态资源。Vite意在提供开箱即用的配置，同时它的插件API和JavaScriptAPI带来了高度的可扩展性，并有完整的类型支持。vite在打包时已经做了优化（代码分割、异步加载优化等），因此，无需我们过多配置即可使用。使用Vite需要Node.js版本14.18+，16+。然
目录名称不能为api，否则会出现├F10:PM┤[vite]getaddrinfoENOTFOUNDrivtrust.jz-xxx.xyz，修改为_api；vue3的全局变量挂载import{createSSRApp}from'vue'constapp=createSSRApp(App)app.config.globalProperties.$interface=$interface全局变量的引入：import{getCurrentInstance}from'vue'const{proxy}=getCurrentInstance()proxy.$interface.wxLogin({ name
