前言这篇文章主要是记录前段时间公司里以vite构建的一个小项目（前端界面不多，主要功能及相关配置是在后端），挺简单的几个小页面。说到vite，之前虽然都有学习了解及demo尝试，但因为业务等其他各方面因素也一直没有一个正式的，借这次机会特别记录下。Vite介绍不说废话，去官网看看配置环境变量根目录下创建env文件夹（也可以不创建env文件夹，直接在根目录下创建对应的环境变量文件）分别创建自己需要的环境文件及对应的配置//类似于这种方式进行配置NODE_ENV="develop"VITE_APP_BASEAPI="https://www.dev.com"vite.config.ts文件中进行配置
前言2021年8月5日，Vue正式发布3.2版本，同时，Vue的作者尤雨溪还在个人微博称：“+TS+Volar=真香”；2022年1月22日，Vue官方宣布Vue3成为了新的默认版本。如今的Vue3已经势不可挡，当然，搭建一个全新的Vue3项目也有了全新的方式，今天就带大家熟悉一下Vue3项目的全新搭建方式。搭建步骤：下载node版本>16.0建目录，如（vue3Study）用IDE工具打开终端，输入命令npminitvue@latest接下来会让我们依次输入以下几个问题的答案，帮助创建项目：Projectname：项目名称，默认值：vue-project，可输入想要的项目名称，此处不建议中文
前言2021年8月5日，Vue正式发布3.2版本，同时，Vue的作者尤雨溪还在个人微博称：“+TS+Volar=真香”；2022年1月22日，Vue官方宣布Vue3成为了新的默认版本。如今的Vue3已经势不可挡，当然，搭建一个全新的Vue3项目也有了全新的方式，今天就带大家熟悉一下Vue3项目的全新搭建方式。搭建步骤：下载node版本>16.0建目录，如（vue3Study）用IDE工具打开终端，输入命令npminitvue@latest接下来会让我们依次输入以下几个问题的答案，帮助创建项目：Projectname：项目名称，默认值：vue-project，可输入想要的项目名称，此处不建议中文
vite+vue3proxy配置代理服务器解决本地运行跨域问题1.什么是跨域呢？首先，明白什么是同源策略？同源就是指协议、域名、端口都要相同，其中任何一个不同都会出现跨域。例如：http://www.xxx.com:8000//http是协议//www.xxx.com是域名//8000是端口跨域，是指浏览器不能执行其他网站的脚本。是由浏览器的同源策略造成的，是浏览器对JavaScript实施的安全限制，是浏览器的行为。特别是前后端分离的模式下，由于前后端域名不一致，就会出现跨域问题。2.访问接口控制台报错3.vite+vue3如何解决在本地想请求后端的一个接口“http://xxx/api/t
vite+vue3proxy配置代理服务器解决本地运行跨域问题1.什么是跨域呢？首先，明白什么是同源策略？同源就是指协议、域名、端口都要相同，其中任何一个不同都会出现跨域。例如：http://www.xxx.com:8000//http是协议//www.xxx.com是域名//8000是端口跨域，是指浏览器不能执行其他网站的脚本。是由浏览器的同源策略造成的，是浏览器对JavaScript实施的安全限制，是浏览器的行为。特别是前后端分离的模式下，由于前后端域名不一致，就会出现跨域问题。2.访问接口控制台报错3.vite+vue3如何解决在本地想请求后端的一个接口“http://xxx/api/t
vite创建vue3+ts项目为何选择vite：vite是一个基于Vue3单文件组件的非打包开发服务器，它做到了本地快速开发启动：快速的冷启动，不需要等待打包操作；即时的热模块更新，替换性能和模块数量的解耦让更新飞起；真正的按需编译，不再等待整个应用编译完成，这是一个巨大的改变。（平均一秒run）本文技术栈是vue3+vue-router+ts+vite+element-plus+pinia。初始化项目（1）在需要创建位置cmd目录下执行npminitvite@latest（2）输入项目名称（3）选择vue（（有时出现上下键不能选择，手动输入选项回车就行））（4）选择vue-ts（或者是选择语
vite创建vue3+ts项目为何选择vite：vite是一个基于Vue3单文件组件的非打包开发服务器，它做到了本地快速开发启动：快速的冷启动，不需要等待打包操作；即时的热模块更新，替换性能和模块数量的解耦让更新飞起；真正的按需编译，不再等待整个应用编译完成，这是一个巨大的改变。（平均一秒run）本文技术栈是vue3+vue-router+ts+vite+element-plus+pinia。初始化项目（1）在需要创建位置cmd目录下执行npminitvite@latest（2）输入项目名称（3）选择vue（（有时出现上下键不能选择，手动输入选项回车就行））（4）选择vue-ts（或者是选择语
目录前言一、环境要求二、创建项目三、安装和使用NaiveUI1、安装NaiveUI2、使用NaiveUI（直接引入）3、使用NaiveUI（自动引入引入）4、使用图标四、安装TailwindCSS五、NaiveUI整合TailwindCSS及遇到的问题前言NaiveUI：一个完全使用TypeScript编写的Vue3组件库，也是Vue作者尤大推荐的Vue组件库。TailwindCSS：能让你少写很多代码的css工具库。本案例使用最新的Vue3，Vite3，TypeScript搭建NaiveUI官网：www.naiveui.comTailwindCSS官网：www.tailwindcss.cn一
目录前言一、环境要求二、创建项目三、安装和使用NaiveUI1、安装NaiveUI2、使用NaiveUI（直接引入）3、使用NaiveUI（自动引入引入）4、使用图标四、安装TailwindCSS五、NaiveUI整合TailwindCSS及遇到的问题前言NaiveUI：一个完全使用TypeScript编写的Vue3组件库，也是Vue作者尤大推荐的Vue组件库。TailwindCSS：能让你少写很多代码的css工具库。本案例使用最新的Vue3，Vite3，TypeScript搭建NaiveUI官网：www.naiveui.comTailwindCSS官网：www.tailwindcss.cn一
一、前言vue3的快速更新，很多IT发展快的地区在22开始都已经提上日程，小编所在的青岛好像最近才有点风波。vue3的人才在青岛还是比较稀缺的哈，纯属小编自己的看法，可能小编是个井底之蛙！！vue2+webpack的时代要过去了，主要是启动时间太慢了。所以还是比较推荐使用Vite进行构建，vue3官方也是推荐的！！速度快，基本上是秒启动级别的！带的例子还是vue3最新的组合式语法糖setup。二、vite介绍和搭建1.介绍Vite官网Vite是一个轻量级的、速度极快的构建工具，对VueSFC提供第一优先级支持。作者是尤雨溪，同时也是Vue的作者！Vite3需要Node.js版本14.18+，1
