1. 程式人生 > 其它 >vite.config.ts

vite.config.ts

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import path from 'path';
import vueJsx from '@vitejs/plugin-vue-jsx';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    vueJsx({
      transformOn: true,
      mergeProps: true,
    }),
  ],
  base: './', // 開發或生產環境服務的公共基礎路徑 ,https://vitejs.bootcss.com/guide/build.html#public-base-path
  build: {
    outDir: 'dist', // 打包後的檔名稱,
    terserOptions: {
      // 生產環境下移除console
      compress: {
        drop_console: true,
        drop_debugger: true,
      },
    },
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src'), // 別名路徑
    },
  },
  css: {
    preprocessorOptions: {
      scss: {
        javascriptEnabled: true,
        additionalData: `@import "./src/assets/variables.scss";`, // 配置全域性 scss
      },
    },
  },
  server: {
    https: false, // 是否開啟https
    open: true, // 是否自動開啟瀏覽器
    port: 3000, // 埠號
    host: true, // 指定伺服器應該監聽哪個 IP 地址。 如果將此設定為 0.0.0.0 或者 true 將監聽所有地址,包括區域網和公網地址。
    proxy: {
      '/api': {
        target: '', // 後臺介面,
        changeOrigin: true,
        secure: false, // 如果是 https 介面需要配置這個引數
        // ws:false,//websocket
        rewrite: (path) => path.replace(/^\/api/, ''), // 路徑重寫
      },
    },
  },
});