创建项目

  • 创建项目
npm init vite
√ Project name: ... wego-admin
√ Select a framework: » vue
√ Select a variant: » vue-ts
  • 安装依赖
npm install
  • 运行项目
npm run dev

安装@vueuse/core : 组件吸附

npm install @vueuse/core

安装轮播图插件

npm install @splidejs/vue-splide

安装types-node


安装mitt 用于组件之间传值

npm install mitt -S

安装sass

npm install sass -S

安装less

npm i less-loader less --save-dev

安装 normalize.css

npm install normalize.css

安装 element-plus及相关

element-plus

  • npm install element-plus --save
  • npm install -D unplugin-vue-components unplugin-auto-import


Icon

npm install @element-plus/icons-vue

安装vue-router

npm install vue-router@4 -S

安装mitt 用于组件之间传值

npm install mitt -S

安装qs

npm install qs

安装axios

npm install axios -S

安装mockjs

npm install mockjs -save-dev

安装pinia

npm install pinia

安装pinia持久化存储插件

命令:npm install pinia-plugin-persist --save

安装富文本编辑器:wangeditor

  • npm install @wangeditor/editor --save
  • npm install @wangeditor/editor-for-vue@next --save

设置代理

打开vite.config.ts:

Vue 3 + TypeScript + Vite创建项目并安装常用插件相关推荐

  1. 正常的vite创建项目并且安装vue router,vant的代码示例

    [dalaojun@localhost django_luichun]$ npm init @vitejs/app my-vue-app -- --template vueScaffolding pr ...

  2. vue vite创建项目的使用(使用技术栈vue3+vuex+router+ts+element plus)

    文章目录 前言 创建vite项目 vite.config.ts配置 自动化引入组件配置以及.env配置的引用 创建src/vite-env.d.ts main.ts配置 api/request.ts ...

  3. 搭建 Vite + Vue 3 + Typescript + tsx + less 项目

    搭建 Vite + Vue 3 + Typescript + tsx + less 项目 项目地址: https://github.com/DuXiaoHeng/vue3-tsx 1. 使用vite脚 ...

  4. vue3使用vite创建项目【2分钟】

    命令讲解 [查看版本] [dalaojun@localhost luichunvue]$ node -v v14.15.0 [dalaojun@localhost luichunvue]$ npm - ...

  5. @vue/cli3--使用命令创建项目--方法/实例

    原文网址:@vue/cli3--使用命令创建项目--方法/实例_IT利刃出鞘的博客-CSDN博客 简介 说明 本文用实例来介绍vue-cli3如何使用命令来创建项目. 系列文章 Vue-cli2--使 ...

  6. vue ui 可视化界面 创建项目 报错:command failed: yarn --json。。。。。

    清除npm缓存 npm cache clean --force 然后重新启动 vue ui,这次创建项目成功了

  7. 解决@vue/cli 创建项目是安装chromedriver时失败的问题

    最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...

  8. Vue创建项目、安装插件、引入全局的less变量

    一.查看npm环境变量配置: ①使用快捷键windows+r打开任务管理器 ②输入cmd进入 ③检查是否安装,成功会返回版本号 node -v npm -v 安装node:https://nodejs ...

  9. Vue(八)vue 脚手架、脚手架创建项目示例

    目录 一.vue 脚手架 1. 脚手架搭建项目的步骤 2. 使用 vscode 打开并运行脚手架项目 3. 脚手架文件夹结构(同SPA 4部分) 4. 避免组件间样式冲突 5. 懒加载 二.举例:使用 ...

最新文章

  1. Nat. Commun | 结合二维深度神经网络和迁移学习 预测RNA二级结构
  2. 微信公众平台开发--微信网页授权
  3. linux下已修改但尚未保存_Linux下历史命令保存、默认值修改的问题
  4. 信号通路:PI3K信号通路与PI3Kα抑制剂
  5. 详解Spring缓存注解@Cacheable,@CachePut , @CacheEvict使用
  6. 一 流程控制之if判断
  7. 简单聊聊C#中lock关键字
  8. controller调用controller的方法_SpringBoot 优雅停止服务的几种方法
  9. 鼎信诺oracle_鼎信诺审计系统操作说明
  10. 协议编码分析 - ARP协议详解
  11. request对象作为:作用域
  12. 不错的json在线编辑器
  13. 亲民地理35期-雨中登泰山_我是亲民_新浪博客
  14. iOS微信聊天记录迁移时报错:当前网络状况复杂
  15. 定期存款可以提前取出来吗_存的定期可以提前取吗
  16. python保存高维数组array
  17. 图片轮换的按钮如何通过像素定位
  18. clumsy 弱网测试工具
  19. ijkplayer 视频播放器集成(附带支持https的so库)
  20. 计算机毕业设计SSM大数据与智能工程系教师档案管理系统【附源码数据库】

热门文章

  1. 基于C++OpenGL实现的小桌子图形绘制
  2. ARM指令之精髓DMB,DSB,ISB指令
  3. 一个基于Tensorflow的神经网络机器翻译系统
  4. 如何转换音频数据格式1
  5. [推荐]同方威视招聘AI人工智能高级人才
  6. 电子技术应用: 基于ADAS的汽车倒车防碰撞系统设计与研究
  7. 高德地图开发设置细节概览
  8. Java的private修饰符
  9. 如何利用迅雷下载百度云
  10. 100+情人节卡通线条简笔图案矢量素材