vite.config.js或者vue.config.js配置

vue3 config+vite 配置

import { defineConfig } from "vite";
import { resolve } from "path";
import vue from "@vitejs/plugin-vue";
import { createSvg } from "./src/icons/index";


export default defineConfig({
  // 添加svg插件
  plugins: [vue(), createSvg("./src/icons/svg/")],
  // 识别 @ 符号为"./src"目录开始
  resolve: {
    alias: {
      "@": resolve("./src"),
    },
  },
  server: {
    // 开启 https,一般不开启
    https: true,
    //配置代理转发,解决跨域问题,可以配置多个
    proxy: {
      "/abc": {
        target: "http://123.456.78.180/",
        changeOrigin: true,
        ws: true,
        rewrite: (path) =>
          path.replace(/^\/abc/, "/abc"),
      }
    },
  },
  css: {
    //css预处理
    preprocessorOptions: {
      additionalData: '@import "@/styles/layout.scss";',
    },
  },
});

vue2+webpack config 配置

const path = require('path')
module.exports = {
  publicPath: './', // 打包出的目标代码就可以在任意目录下访问
  //  publicPath: '/app/', //署应用包时的基本 URL。  vue-router history模式使用
  outputDir: 'dist', //  生产环境构建文件的目录
  assetsDir: 'static', //  outputDir的静态资源(js、css、img、fonts)目录
  lintOnSave: false,
  productionSourceMap: false, // 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。
  devServer: {
    port: 8082, // 端口   
    https: true,// 开启 https,一般不开启
    open: false, // 启动后打开浏览器
    disableHostCheck: true,
    overlay: {
      //  当出现编译器错误或警告时,在浏览器中显示全屏覆盖层
      warnings: false,
      errors: true
    },
   proxy: {
     //配置跨域
      '/api': {
        target: 'http://localhost:3000',
        changeOrigin: true // 允许跨域
        pathRewrite: {
           '/api': '/api'
        }
      }
    }
}

你可能感兴趣的:(vue.config.js,javascript,vue.js,前端)