vue3 中 vite 配置

未曾想努力的或者只为了成为一个普通人

前端QQ群: 981668406
在此附上我的QQ: 2489757828 有问题的话可以一同探讨
我的github: 李大玄
我的私人博客: 李大玄
我的npm开源库: 李大玄
我的简书: 李大玄
我的CSDN: 李大玄
我的掘金: 李大玄
哔哩哔哩: 李大玄

/* jshint esversion: 6 */
/*
 * @Description: 
 * @Author: 李大玄
 * @Date: 2021-08-11 14:02:24
 * @FilePath: /ucenter-messageflat-web-view/vite.config.js
 */

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import styleImport from 'vite-plugin-style-import';

import path from 'path';

const timestamp = 'chunak';
import _ from 'lodash';

let base = '/';
const mode = _.last(process.argv || ['/']);
if (mode == 'develop') {
  base = 'http://xxxxxxxxxxxxxxx/'
}

// https://vitejs.dev/config/
export default defineConfig({

  // 引入第三方的配置
  resolve: {
    extensions: ['.js', '.vue', '.json', ".scss"],
    alias: {
      '@': path.resolve(__dirname, 'src'),
    },
  },
  publicDir: 'public',
  hmr: { overlay: true },
  css: {
    preprocessorOptions: {
      scss: {
        // 引入 var.scss 这样就可以在全局中使用 var.scss中预定义的变量了 @import '@/assets/styles/app.scss'; 
        additionalData: ``,
      }
    },
  },
  ssr: {
    noexternals: ['vuedraggable']
  },
  filenameHashing: false,
  base,
  build: {
    manifest: false,
    outDir: 'dist/20210811',
    assetsDir: 'assets',
    rollupOptions: {
      output: {
        // entryFileNames: `assets/[name].${timestamp}.js`,
        // chunkFileNames: `assets/[name].${timestamp}.js`,
        // assetFileNames: `assets/[name].${timestamp}.[ext]`
        entryFileNames: `assets/[name].js`,
        chunkFileNames: `assets/[name].js`,
        assetFileNames: `assets/[name].[ext]`,
      }
    }
  },
  optimizeDeps: {
    exclude: [],
  },
  server: {
    open: true,// 是否自动在浏览器打开
    https: false,// 是否开启 https
    ssr: false,// 服务端渲染
    hot: true,
    outDir: 'target',
    host: "0.0.0.0",
    port: 1011,
    proxy: {
      '/sms-business-web': {
        target: 'http://xxxxxxxxxxxxx/',
        // target: 'http://192.168.169.242:7125/', // 
        // changeOrigin: true,
        // loglevel: "debug",
        // rewrite: path => path.replace(/^\/wecom-business-web/, '')
      },
    },
  },
  plugins: [
    vue(),
    styleImport({
      libs: [{
        libraryName: 'element-plus',
        esModule: true,
        ensureStyleFile: true,
        resolveStyle: (name) => {
          name = name.slice(3)
          return `element-plus/packages/theme-chalk/src/${name}.scss`;
        },
        resolveComponent: (name) => {
          return `element-plus/lib/${name}`;
        },
      }]
    })
  ],

})