import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import legacy from '@vitejs/plugin-legacy'
import postcsspxtoviewport from 'postcss-px-to-viewport'
import styleImport, { VantResolve } from 'vite-plugin-style-import';
const path = require('path')
export default defineConfig({
plugins: [
vue(),
styleImport({
resolves: [VantResolve()],
libs: [
{
libraryName: "vant",
esModule: true,
resolveStyle: (name) => {
return `../es/${name}/style/index`;
}
}
]
}),
legacy({
targets: ['defaults', 'not IE 11']
})
],
resolve: {
alias: {
'@': path.resolve(__dirname, 'src'),
'@api': path.resolve(__dirname, 'src/api'),
'_c': path.resolve(__dirname, 'src/components'),
'_v': path.resolve(__dirname, 'src/views')
},
extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
},
css: {
postcss: {
plugins: [
postcsspxtoviewport({
unitToConvert: 'px',
viewportWidth: 750,
unitPrecision: 6,
propList: ['*'],
viewportUnit: 'vw',
fontViewportUnit: 'vw',
selectorBlackList: ['ignore-'],
minPixelValue: 1,
mediaQuery: false,
replace: true,
exclude: [/node_modules/],
landscape: false,
landscapeUnit: 'vw',
landscapeWidth: false,
})
]
},
preprocessorOptions: {
less: {
javascriptEnabled: true,
additionalData: `@import "${path.resolve(__dirname, 'src/assets/css/mixin.less')}";`
}
}
},
build: {
chunkSizeWarningLimit: 2000,
minify: 'terser',
terserOptions: {
compress: {
drop_console: true,
drop_debugger: true
}
},
rollupOptions: {
output: {
chunkFileNames: 'js/[name]-[hash].js',
entryFileNames: 'js/[name]-[hash].js',
assetFileNames: '[ext]/[name]-[hash].[ext]'
}
}
},
server: {
port: 8091,
proxy: {
'/api': {
target: 'http://test1.cn',
changeOrigin: true
},
'^/web|^/h5': {
target: 'http://test2.cn',
changeOrigin: true
},
}
}
})