vue初始化

1. vue.config.js初始化配置

/***
 * @Description:
 * @Author: Harry
 * @Date: 2021-11-11 10:13:01
 * @Url: https://u.mr90.top
 * @github: https://github.com/rr210
 * @LastEditTime: 2021-11-11 10:13:01
 * @LastEditors: Harry
 */
// vue.config.js
*/
// vue.config.js
const path = require('path')
// 定制主题
const webpack = require('webpack')
const themePath = path.join(__dirname, './src/assets/css/themevars.less')
const CompressionWebpackPlugin = require('compression-webpack-plugin')
const productionGzipExtensions = ['js', 'css']
module.exports = {
  publicPath: './', // 文件加载设置为相对路径
  outputDir: './medicine/static/',
  productionSourceMap: process.env.NODE_ENV !== 'pro',
  // lintOnSave: false, // 关闭eslint
  configureWebpack: {
    resolve: {
      alias: {
        '@': path.resolve(__dirname, './src')
      }
    },
    plugins: [
      new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
      // 下面是下载的插件的配置
      new CompressionWebpackPlugin({
        algorithm: 'gzip',
        test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
        threshold: 10240,
        minRatio: 0.8,
        deleteOriginalAssets: false // 不删除源文件
      }),
      new webpack.optimize.LimitChunkCountPlugin({
        maxChunks: 5,
        minChunkSize: 100
      })
    ]
  },
  chainWebpack: config => {
    config
      .plugin('html')
      .tap(args => {
        args[0].title = '中草药害虫识别'
        return args
      })
    if (process.env.NODE_ENV === 'pro') {
      config.plugins.delete('preload')
      config.plugins.delete('prefetch')
    }
  },
  devServer: {
    open: false, // 项目启动时是否自动打开浏览器，我这里设置为false,不打开，true表示打开
    proxy: {
      '/v1': {
        target: 'http://127.0.0.1:5051/', // 对应自己的接口，代理地址修改后必须重启项目
        // target: 'http://2e3e-60-223-236-230.ngrok.io', // 对应自己的接口，代理地址修改后必须重启项目
        // target: 'https://detect.mr90.top/', //对应自己的接口，代理地址修改后必须重启项目
        changeOrigin: true, // 是否允许跨域
        pathRewrite: {
          // 重写路径，当我们在浏览器中看到请求的地址为：http://localhost:8080/api/user/userInfo 时
          // 实际上访问的地址是：http://192.168.1.249:9527/user/userInfo,因为重写了 /api
          '^/v1': ''
        }
      }
    }
  }
}

2. eslintrc.js配置

"space-before-function-paren": 0,  // 函数定义时括号前面要不要有空格

3. axios配置

import axios from 'axios'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
axios.defaults.baseURL = process.env.VUE_APP_URL
const startLoading = () => {
  NProgress.start()
}
const endLoading = () => {
  NProgress.done()
}
// 请求拦截
// axios.defaults.withCredentials = true
axios.interceptors.request.use((config) => {
  // 加载
  startLoading()
  return config
})
// 响应拦截
axios.interceptors.response.use((response) => {
  // 结束loading
  endLoading()
  return response
}, error => {
  // 结束loading
  endLoading()
  // 错误提醒
  return Promise.reject(error)
})
export default axios