使用vite创建vue程序，同时引入element-plus
步骤如下：
一、安装vite
npm install -g create-vite
二、创建vue程序，不需要先创建好空的文件夹，直接执行下面的代码即可
create-vite test --template vue
三、使用npm引入element-plus
npm install element-plus
四、为element-plus引入名为theme-chalk的样式
npm i @element-plus/theme-chalk
五、编辑App.vue，完整代码如下：
<script setup> import HelloWorld from './components/HelloWorld.vue' </script> <template> <div> <a href="https://vitejs.dev" target="_blank"> <img src="/vite.svg" class="logo" alt="Vite logo" /> </a> <a href="https://vuejs.org/" target="_blank"> <img src="./assets/vue.svg" class="logo vue" alt="Vue logo" /> </a> </div> <HelloWorld msg="Vite + Vue" /> <div> <el-button type="primary">Element Plus Button</el-button> </div> </template> <style scoped> .logo { height: 6em; padding: 1.5em; will-change: filter; transition: filter 300ms; } .logo:hover { filter: drop-shadow(0 0 2em #646cffaa); } .logo.vue:hover { filter: drop-shadow(0 0 2em #42b883aa); } </style> <script> import { ElButton } from 'element-plus'; import '@element-plus/theme-chalk/dist/index.css' export default { components: { ElButton } } </script>
六、启动test项目
cd test && npm run dev