如何创建vite项目？vite配置elementplus报错

　　大家好，我是Smile。
　　今天给大家分享如何使用vite搭建vue3项目及可能遇到的相关问题。欢迎朋友们多多指教，多多支持
　　安装ElementPlus
　　vitevue3相关知识记录
　　使用vite搭建vue3。0项目Smileping的博客CSDN博客
　　vite常用配置Smileping的博客CSDN博客vite配置
　　vite配置环境变量与模式Smileping的博客CSDN博客vitebuild。env。production
　　创建vite项目按照顺序执行如下命令，即可基于vite创建vue3。x的工程项目npminitviteapp项目名称cd项目名称npminstallnpmrundev
　　安装并使用elementplus根据官方文档安装、根据需求配置，这里选择官方推荐按需导入方式选择一个你喜欢的包管理器NPMnpminstallelementplussaveYarnyarnaddelementpluspnpmpnpminstallelementplus
　　按需导入：首先需要安装unpluginvuecomponents和unpluginautoimport这两款插件npminstallDunpluginvuecomponentsunpluginautoimport
　　配置vite。config。jsvite。config。tsimport｛defineConfig｝fromviteimportAutoImportfromunpluginautoimportviteimportComponentsfromunpluginvuecomponentsviteimport｛ElementPlusResolver｝fromunpluginvuecomponentsresolversexportdefaultdefineConfig（｛。。。plugins：〔。。。AutoImport（｛resolvers：〔ElementPlusResolver（）〕，｝），Components（｛resolvers：〔ElementPlusResolver（）〕，｝），〕，｝）
　　至此顺利的话，可以正常运行项目啦。
　　报错问题部分截图，原因：当前vite版本过低
　　当前vite版本
　　解决方案卸载重新安装vite版本，当前最新版本vite：4。1。1npminstallviteD
　　运行报错安装vite成功后，重新启动运行报错原因：当前node版本【14。15。1】与vite版本【4。1。1】不匹配，导致报错查看所有node版本命令：npmviewnodeversions
　　解决版本不兼容问题我这里选择升级node版本【14。18。2】，当然也可以选择降级vite版本处理。
　　node版本升级后，运行报错node版本升级后，项目运行报错，如下图
　　继续解决报错问题根据提示：安装vitejspluginvuenpmivitejspluginvueS
　　这时如果直接运行，会出现如下错误，需要配置文件中导入插件
　　在vite。config。js配置文件中导入并使用vitejspluginvueimport｛defineConfig｝fromvite。。。importvuefromvitejspluginvueexportdefaultdefineConfig（｛plugins：〔vue（），。。。〕，｝）
　　成功解决当前问题npmrundev成功启动项目当前package。json文件
　　创作不易，欢迎老铁们互动关注，点点赞，收藏不迷路