创建Vue3项目(vue3+vue-router+ts+vite+element-plus+pinia)

本文用到的技术栈是 vue3+vue-router+ts+vite+element-plus+pinia

1、创建vue3项目

在终端输出 npm create vue@latest

我一般会选择这几个,如果用js的就无需选择ts

这样显示就表示创建成功了

2、进入项目,安装依赖,执行项目

cd 项目名,比如我的项目名叫vue-ts,我是cd vue-ts,接着执行 npm install,执行完成后再npm run dev

点击进入页面,显示如图所示就创建完成了

3、继承组件库Element-Plus

安装Element-plus库

在终端输入npm install element-plus --save

在main.ts中注册和引用element-plus

安装element-plus图标 在终端输入npm install @element-plus/icons-vue

安装完成后,在main.ts中注册并引用

4、安装完成,测试

在element-plus文档中复制了一些按钮和图标到app.vue中

查看页面是否显示element-plus组件

这样就算成功引用element-plus了

相关推荐
Hooray10 分钟前
2026年,站在职业生涯十字路口的我该何去何从?
前端·后端
小二·11 分钟前
Python Web 开发进阶实战:安全加固实战 —— 基于 OWASP Top 10 的全栈防御体系
前端·python·安全
over69718 分钟前
🌟 JavaScript 数组终极指南:从零基础到工程级实战
前端·javascript·前端框架
社恐的下水道蟑螂19 分钟前
深入掌握 AI 全栈项目中的路由功能:从基础到进阶的全面解析
前端·react.js·全栈
米诺zuo19 分钟前
Angular 18 核心特性速查表
前端
hey_ner20 分钟前
进度条图表简单化
前端·css·css3
苏西的网络日志22 分钟前
前端项目缓存控制与自动版本检查方案实现
前端
小遁哥29 分钟前
通过AI从零开发RN到在安卓手机上运行
前端·react native·cursor
sure28232 分钟前
react native中实现视频转歌
前端·react native
weipt37 分钟前
关于vue项目中cesium的地图显示问题
前端·javascript·vue.js·cesium·卫星影像·地形