vue常用依赖

一、axios

npm install axios --save-dev

main.js引入

import axios from 'axios'
Vue.prototype.axios = axios

二、ElementUI

npm i element-ui -S  

main.js引入

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);    // 即可直接使用文档

三、qs

npm install qs -S

main.js引入

import qs from 'qs';
Vue.prototype.$qs = qs //即可直接使用  this.$qs

四、echarts

npm install echarts --save

main.js引入

import echarts from 'echarts'
Vue.prototype.$echarts = echarts  

五、文本编辑器mavonEditor

 npm install mavon-editor --save 

main.js引入

import mavonEditor from 'mavon-editor'
import 'mavon-editor/dist/css/index.css'
Vue.use(mavonEditor)

六、二维码qrcodejs2

npm i qrcodejs2 -S

七、文本编辑器vue-quill-editor

npm install vue-quill-editor -S

main.js引入

// main.js
import Vue from 'vue'
import VueQuillEditor from 'vue-quill-editor'
import 'quill/dist/quill.core.css' // import styles
import 'quill/dist/quill.snow.css' // for snow theme
import 'quill/dist/quill.bubble.css' // for bubble theme
Vue.use(VueQuillEditor, /* { default global options } */)

八、 axios低版本浏览器补丁es6-promise依赖包

npm install --save es6-promise

九、 cookie封装库

npm install --save js-cookie

十、vue-echarts

npm install echarts@5.0.2 vue-echarts

要在 Vue 2 下使用 vue-echarts，需要确保 @vue/composition-api 已经安装：

npm i -D @vue/composition-api

main.js引入

// main.js
import Vue from 'vue'
import ECharts from 'vue-echarts'
// 手动引入 ECharts 各模块来减小打包体积
import {
  CanvasRenderer
} from 'echarts/renderers'
import {
  BarChart
} from 'echarts/charts'
import {
  GridComponent,
  TooltipComponent
} from 'echarts/components'
// 全局注册组件（也可以使用局部注册）
Vue.component('v-chart', ECharts)
new Vue(...)

十一、国际化vue-i18n

npm install vue-i18n

十二、存储持久化vuex-persist

npm install  vuex-persist -S

import VuexPersistence from 'vuex-persist'
const vuexLocal = new VuexPersistence({
  storage: window.localStorage
})
 
const store = new Vuex.Store({
  state: { ... },
  mutations: { ... },
  actions: { ... },
  plugins: [vuexLocal.plugin]
}) 

十三、下载jQuery

下载

npm install jQuery

局部引入

 import $ from 'jquery'
 export default {
 ...
 }

使用

mounted(){
 $(function () {
    //得到焦点
    $("#password").focus(function () {
    }
}