vue.config.js基础配置

103 阅读1分钟
const path = require('path')// 引入path模块
function resolve (dir) {
  return path.join(__dirname, dir)// path.join(__dirname)设置绝对路径
}
module.exports = {
  // build时构建文件的目录名称 构建时传入 --no-clean 可关闭该行为
  outputDir: process.env.VUE_APP_FILE_NAME,
  publicPath: './',
  // build时放置生成的静态资源 (js、css、img、fonts) 的目录
  assetsDir: 'assets',
  chainWebpack: (config) => {
    config.resolve.alias
      .set('@', resolve('src')) // 设置别名
      .set('@assets', resolve('src/assets'))
      .set('@views', resolve('src/views'))
  },
  // 代理服务 配置项目跨域
  devServer: {
    // host: 'localhost',
    // 服务端口
    port: 8087,
    // 配置自动启动浏览器
    // open: true,
    proxy: {
      '/api': {
        target: process.env.VUE_APP_API, // 请求地址
        ws: true, // 开启WebSocket
        changeOrigin: true, // 是否跨域
        pathRewrite: {
          '^/api': '' // 改写路径
        }
      }
    }
  }
}

写在最后

本次算是笔记分享吧 , 怕下次写这功能时要翻找资料 ,所以就一次性记录一下!