Vue常见问题解决方案

const { defineConfig } = require('@vue/cli-service')
// 路径模块
const path = require('path')
const lessPath = path.join( __dirname, './src/theme.less' )
module.exports = defineConfig({
  transpileDependencies: true,
  css: {
    loaderOptions: {
      less: {
        // 若 less-loader 版本小于 6.0，请移除 lessOptions 这一级，直接配置选项。
        lessOptions: {
          modifyVars: {
            // 或者可以通过 less 文件覆盖（文件路径为绝对路径）
            hack: `true; @import "${lessPath}";`,
          },
        },
      },
    },
  }
})

import 'vant/lib/index.less';    // 导入vant组件库的样式表文件

// 导入
import axios from 'axios'             // 导入 axios
const request = axios.create( {
  baseURL: 'http://127.0.0.1:2022'    // 请求根路径
} )
// 导出
export default request

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import Vant from 'vant';              // 导入 vant 组件库
import 'vant/lib/index.less';         // 导入 vant 组件库的样式列表 主题定制之后的样式列表
import request from '@/utils/request.js'  // 导入发起请求对象
Vue.config.productionTip = false
Vue.use(Vant)                         // vant 组件全局挂载
Vue.prototype.$http = request         // 发起请求对象挂载全局属性
// 创建app实例对象
const app = new Vue({
  router,
  render: h => h(App)
})
app.$mount('#app')

this.$http

import Vue from "vue";
import 导入需要挂载的
Vue.prototype.$属性名= 要挂载的;
new Vue({
  router,
  store,
  render: (h) => h(App),
}).$mount("#app");

this.$自己挂载的属性