vue整合axios和element

vue整合axios和element)

  • 整合axios
  • 整合element
  • 整合element-plus

整合axios

安装axios

npm install axios

在项目目录下添加vue.config.js,配置多个代理路径复制proxy对象即可,但匹配字段不能相同。

module.exports = {
    devServer: {
        //要设置当前访问的ip 否则失效
        host:"localhost",
        //浏览器自动打开页面
        open: true,
        proxy: {
            '/api': {
                target: 'http://localhost:5137/',
                ws: true,
                pathRewrite:{
                    '^/api':''
                }
            },
            '/name1': {
                target: 'http://localhost:5177/',
                ws: true,
                pathRewrite:{
                    '^/name1':''
                }
            }
        }
    }
}

在main.js中配置

import axios from 'axios'
Vue.prototype.$http=axios
axios.defaults.baseURL = '/api';

整合element

安装

npm i element-ui -S

在项目中导入

import Element from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(Element);

整合element-plus

安装

npm install element-plus --save

在项目中执行

vue add element-plus

修改导入element.js文件路径

import 'element-plus/theme-chalk/index.css'

你可能感兴趣的:(vue,vue,vue.js)