依赖项相关说明

 "dependencies": { 
    //主页面
    "@riophae/vue-treeselect": "^0.4.0",//树形多选框,菜单等使用
    "vue-count-to": "^1.0.13",//数据动态滚动展示
    "echarts": "^4.9.0",
    "fuse.js": "^6.4.1",    
    "screenfull": "^5.0.2",

	//用户登录
	"js-cookie": "^2.2.1",//数据缓存
    "jsencrypt": "^3.0.0-rc.1",//数据加密
    "vue-cropper": "^0.5.5",//头像裁剪
    
    //页面 element样式
    "element-ui": "^2.13.2",

    //vue 请求封装
    "axios": "^0.20.0",
    "vue-axios": "^2.1.5",

	//模拟请求响应数据
    "mockjs": "^1.1.0",
    
    //vue路由
    "vue-router": "^3.2.0",
    
    //vue核心依赖
    "core-js": "^3.6.5",
    "vue": "^2.6.11",
    
    //vue状态管理
    "vuex": "^3.4.0"
  },

vue核心依赖

vue
core-js

相关配置:
main.js

接口调用:

axios:与ajax类似,可以直接调用后台接口
vue-axios:axios插件,在vue中嵌套axios对象,可以在vue中直接使用,而不用再次引入

相关配置:
main.js
api.js

import axios from ‘axios’
import VueAxios from ‘vue-axios’
//使用vue-axios 插件
Vue.use(VueAxios, axios)

页面路由:

vue-router:页面路由配置

相关配置:
router/index.js

页面样式:

element-ui
element-theme
element-theme-chalk

Vue.use(ElementUI, {
size: ‘small’
})

浏览器兼容:

babel-polyfill:浏览器向下兼容

相关配置
main.js

import “babel-polyfill”;

状态管理

vuex

相关配置
store/index.js

import Vuex from ‘vuex’
Vue.use(Vuex)
export default new Vuex.Store({
state: {
},
mutations: {
},
actions: {
},
modules: {
}
})
后续做模块化处理

图表相关

echarts
vue-schart

dashboard中使用

搜索引擎

fuse.js

HeaderSearch/index.vue 使用

树形多选框

@riophae/vue-treeselect

Logo

前往低代码交流专区

更多推荐