vite + vue3项目所用网站地址

最新推荐文章于 2024-08-28 12:03:30 发布

原创最新推荐文章于 2024-08-28 12:03:30 发布 · 706 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#vue3 vite

vue+apicloud 专栏收录该内容

32 篇文章

订阅专栏

本文介绍了如何在Vue3项目中使用ElementPlus组件库，包括查看官方Demo、安装及解决诡异问题的途径。同时，讲解了实现全屏功能的步骤，利用screenfull库进行切换。此外，推荐了WangEditor作为富文本编辑器，并提到了G2Plot图表库用于数据可视化，建议在安装时配合TypeScript以避免错误。最后，提及了一个可以替代Vuex的工具vue-quill。

elementplus 官方demo https://element-plus.github.io/theme-chalk-preview/#/zh-CN

elementplus 官方 https://element-plus.gitee.io/#/zh-CN/component/installation

elementplus 官方issues诡异问题找不到就在此地址查看 https://github.com/element-plus/element-plus/issues

vue3实现大屏功能建议写两页，点击跳转进入大屏 https://www.npmjs.com/package/screenfull

安装
npm install screenfull --save
在使用.vue文件中引入
import screenfull from ‘screenfull’
在按钮方法中调用方法可以双向切换全屏与非全屏
screenfull.toggle()

富文本使用 https://www.wangeditor.com/doc/

图表使用G2plot https://antv-g2plot.gitee.io/zh/docs/manual/introduction

使用时建议安装ts不然报错

可以代替vuex的工具 https://vueup.github.io/vue-quill/guide/usage.html#in-the-browser

{
  "name": "jmyuyu",
  "version": "0.0.1",
  "scripts": {
    "dev": "vite",
    "build": "vite build"
  },
  "dependencies": {
    "@antv/g2plot": "^2.3.26",
    "@vueup/vue-quill": "^1.0.0-alpha.40",
    "axios": "^0.21.1",
    "element-plus": "^1.0.2-beta.53",
    "qs": "^6.10.1",
    "sass": "^1.35.1",
    "screenfull": "^5.1.0",
    "vue": "^3.0.5",
    "vue-router": "^4.0.10",
    "vuex": "^4.0.2",
    "wangeditor": "^4.7.5"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^1.0.4",
    "@vue/compiler-sfc": "^3.0.5",
    "vite": "^2.0.0-beta.12"
  }
}