您现在的位置是:首页 >其他 >vite.config.js压缩图片配置网站首页其他
vite.config.js压缩图片配置
import {
defineConfig,
loadEnv
} from 'vite'
import {
resolve
} from 'path'
import uni from '@dcloudio/vite-plugin-uni'
import path from 'path' // 不引入@types/node依赖这里会报错
import AutoImport from 'unplugin-auto-import/vite'
import VueJSX from '@vitejs/plugin-vue-jsx'
import vue from '@vitejs/plugin-vue';export const r = (...args) => resolve(__dirname, '.', ...args)
export default defineConfig(({
command,
mode
}) => {
// const envConfig = loadEnv(mode, './')
const alias = {
'~': path.resolve(__dirname, './'), // 这个 __dirname 也不报错了 ************
// 设置别名 这里的./指的是 vite.config.js 的所载目录(根目录)下面的 src
// '@': path.resolve(__dirname, './src'),
'@': path.resolve(__dirname, './src'),
"@/images": "src/assets/images",
"@/api": resolve(__dirname, "src/api"),
"@/config": resolve(__dirname, "src/config"),
}
const root = process.cwd();
const env = loadEnv(mode, root);
return {
resolve: {
alias: alias,
//extensions数组的意思是在import组件的时候自动补全.vue等文件后缀
extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
},
build:{
outDir: "dist",
// assetsDir:"static",
terserOptions: {
// 生产环境移除console
compress: {
drop_console: true,
drop_debugger: true,
},
},
rollupOptions:{
// external: ['vue','nutui'], // 注意看这里
input:{
index:resolve(__dirname,"index.html"),
// project:resolve(__dirname,"index.html")
},
output:{
chunkFileNames:'static/js/[name]-[hash].js',
entryFileNames:"static/js/[name]-[hash].js",
assetFileNames:"static/[ext]/name-[hash].[ext]"
}
},
},
plugins: [
uni(),
// vue({
// script: {
// refTransform: true
// }
// }),
VueJSX(),
AutoImport({
imports: ['vue'],
dirs: ['./src/utils/permission'],
dts: r('src/auto-imports.d.ts')
}),
// uniReadPagesV3Plugin({
// pagesJsonDir: path.resolve(__dirname, './pages.json'),
// includes: ['path', 'aliasPath', 'name', 'meta'],
// }),
],
server: {
port: 81,
open: true, //vite项目启动时自动打开浏览器
host: true,
hmr: true, //开启热更新
disableHostCheck: true,
proxy: {
'/api': {
target:env.VITE_API_BASEURL,
changeOrigin: true,
rewrite: path => path.replace(/^/api/, '')
}
},
},
publicDir:'public',/*不需要被编译的静态资源目录,(打包图片)默认会把public的图片打包到h5的images里*/
// base:'/',
publicPath: '/',/*配置打包后的资源路径*/
productionSourceMap: false,/*打包的时候不输出map文件,减少大量体积*/
outputDir: 'dist',
assetsDir: 'assets',
/* 放置静态文件夹目录*/css: {
preprocessorOptions: {
scss: {
// // 两种方式都可以
additionalData: '@import "@/assets/uni.scss";'
// // additionalData: '@use "@/assets/scss/global.scss" as *;'
}
// less: {
// javascriptEnabled: true,
// additionalData: '@import "@/assets/uni.scss";'
// }
}
}
}
})