Homepage-imsyy/vite.config.js
2023-12-06 13:41:45 +08:00

123 lines
3.2 KiB
JavaScript

/* eslint-disable no-undef */
import { defineConfig, loadEnv } from "vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import { resolve } from "path";
import { VitePWA } from "vite-plugin-pwa";
import vue from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import viteCompression from "vite-plugin-compression";
// https://vitejs.dev/config/
export default ({ mode }) =>
defineConfig({
plugins: [
vue(),
AutoImport({
imports: ["vue"],
resolvers: [ElementPlusResolver()],
}),
Components({
resolvers: [ElementPlusResolver()],
}),
VitePWA({
registerType: "autoUpdate",
workbox: {
skipWaiting: true,
clientsClaim: true,
runtimeCaching: [
{
urlPattern: /(.*?)\.(js|css|woff2|woff|ttf)/, // js / css 静态资源缓存
handler: "CacheFirst",
options: {
cacheName: "js-css-cache",
},
},
{
urlPattern: /(.*?)\.(png|jpe?g|svg|gif|bmp|psd|tiff|tga|eps)/, // 图片缓存
handler: "CacheFirst",
options: {
cacheName: "image-cache",
},
},
],
},
manifest: {
name: loadEnv(mode, process.cwd()).VITE_SITE_NAME,
short_name: loadEnv(mode, process.cwd()).VITE_SITE_NAME,
description: loadEnv(mode, process.cwd()).VITE_SITE_DES,
display: "standalone",
start_url: "/",
theme_color: "#424242",
background_color: "#424242",
icons: [
{
src: "/images/icon/48.png",
sizes: "48x48",
type: "image/png",
},
{
src: "/images/icon/72.png",
sizes: "72x72",
type: "image/png",
},
{
src: "/images/icon/96.png",
sizes: "96x96",
type: "image/png",
},
{
src: "/images/icon/128.png",
sizes: "128x128",
type: "image/png",
},
{
src: "/images/icon/144.png",
sizes: "144x144",
type: "image/png",
},
{
src: "/images/icon/192.png",
sizes: "192x192",
type: "image/png",
},
{
src: "/images/icon/512.png",
sizes: "512x512",
type: "image/png",
},
],
},
}),
viteCompression(),
],
server: {
port: "3000",
open: true,
},
resolve: {
alias: [
{
find: "@",
replacement: resolve(__dirname, "src"),
},
],
},
css: {
preprocessorOptions: {
scss: {
charset: false,
additionalData: `@import "./src/style/global.scss";`,
},
},
},
build: {
minify: "terser",
terserOptions: {
compress: {
pure_funcs: ["console.log"],
},
},
},
});