feat: 打包优化
This commit is contained in:
102
package-lock.json
generated
102
package-lock.json
generated
@@ -39,6 +39,7 @@
|
||||
"lint-staged": "^13.2.1",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"prettier": "^2.8.4",
|
||||
"terser": "^5.46.1",
|
||||
"typescript": "~4.8.4",
|
||||
"unplugin-auto-import": "^0.15.3",
|
||||
"unplugin-vue-components": "^0.24.1",
|
||||
@@ -668,6 +669,17 @@
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@jridgewell/source-map": {
|
||||
"version": "0.3.11",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.11.tgz",
|
||||
"integrity": "sha512-ZMp1V8ZFcPG5dIWnQLr3NSI1MiCU7UETdS/A0G8V/XWHvJv3ZsFqutJn1Y5RPmAPX6F3BiE397OqveU/9NCuIA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@jridgewell/gen-mapping": "^0.3.5",
|
||||
"@jridgewell/trace-mapping": "^0.3.25"
|
||||
}
|
||||
},
|
||||
"node_modules/@jridgewell/sourcemap-codec": {
|
||||
"version": "1.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
|
||||
@@ -1852,6 +1864,13 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/buffer-from": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
|
||||
"integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/cache-base": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/cache-base/-/cache-base-1.0.1.tgz",
|
||||
@@ -6999,6 +7018,17 @@
|
||||
"urix": "^0.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-support": {
|
||||
"version": "0.5.21",
|
||||
"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
|
||||
"integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"buffer-from": "^1.0.0",
|
||||
"source-map": "^0.6.0"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-url": {
|
||||
"version": "0.4.1",
|
||||
"resolved": "https://registry.npmmirror.com/source-map-url/-/source-map-url-0.4.1.tgz",
|
||||
@@ -7606,6 +7636,32 @@
|
||||
"node": ">= 10"
|
||||
}
|
||||
},
|
||||
"node_modules/terser": {
|
||||
"version": "5.46.1",
|
||||
"resolved": "https://registry.npmjs.org/terser/-/terser-5.46.1.tgz",
|
||||
"integrity": "sha512-vzCjQO/rgUuK9sf8VJZvjqiqiHFaZLnOiimmUuOKODxWL8mm/xua7viT7aqX7dgPY60otQjUotzFMmCB4VdmqQ==",
|
||||
"dev": true,
|
||||
"license": "BSD-2-Clause",
|
||||
"dependencies": {
|
||||
"@jridgewell/source-map": "^0.3.3",
|
||||
"acorn": "^8.15.0",
|
||||
"commander": "^2.20.0",
|
||||
"source-map-support": "~0.5.20"
|
||||
},
|
||||
"bin": {
|
||||
"terser": "bin/terser"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/terser/node_modules/commander": {
|
||||
"version": "2.20.3",
|
||||
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
|
||||
"integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/text-table": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/text-table/-/text-table-0.2.0.tgz",
|
||||
@@ -9075,6 +9131,16 @@
|
||||
"integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
|
||||
"dev": true
|
||||
},
|
||||
"@jridgewell/source-map": {
|
||||
"version": "0.3.11",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.11.tgz",
|
||||
"integrity": "sha512-ZMp1V8ZFcPG5dIWnQLr3NSI1MiCU7UETdS/A0G8V/XWHvJv3ZsFqutJn1Y5RPmAPX6F3BiE397OqveU/9NCuIA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@jridgewell/gen-mapping": "^0.3.5",
|
||||
"@jridgewell/trace-mapping": "^0.3.25"
|
||||
}
|
||||
},
|
||||
"@jridgewell/sourcemap-codec": {
|
||||
"version": "1.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
|
||||
@@ -9937,6 +10003,12 @@
|
||||
"fill-range": "^7.0.1"
|
||||
}
|
||||
},
|
||||
"buffer-from": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
|
||||
"integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==",
|
||||
"dev": true
|
||||
},
|
||||
"cache-base": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/cache-base/-/cache-base-1.0.1.tgz",
|
||||
@@ -13802,6 +13874,16 @@
|
||||
"urix": "^0.1.0"
|
||||
}
|
||||
},
|
||||
"source-map-support": {
|
||||
"version": "0.5.21",
|
||||
"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
|
||||
"integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"buffer-from": "^1.0.0",
|
||||
"source-map": "^0.6.0"
|
||||
}
|
||||
},
|
||||
"source-map-url": {
|
||||
"version": "0.4.1",
|
||||
"resolved": "https://registry.npmmirror.com/source-map-url/-/source-map-url-0.4.1.tgz",
|
||||
@@ -14285,6 +14367,26 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"terser": {
|
||||
"version": "5.46.1",
|
||||
"resolved": "https://registry.npmjs.org/terser/-/terser-5.46.1.tgz",
|
||||
"integrity": "sha512-vzCjQO/rgUuK9sf8VJZvjqiqiHFaZLnOiimmUuOKODxWL8mm/xua7viT7aqX7dgPY60otQjUotzFMmCB4VdmqQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@jridgewell/source-map": "^0.3.3",
|
||||
"acorn": "^8.15.0",
|
||||
"commander": "^2.20.0",
|
||||
"source-map-support": "~0.5.20"
|
||||
},
|
||||
"dependencies": {
|
||||
"commander": {
|
||||
"version": "2.20.3",
|
||||
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
|
||||
"integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"text-table": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/text-table/-/text-table-0.2.0.tgz",
|
||||
|
||||
@@ -43,6 +43,7 @@
|
||||
"lint-staged": "^13.2.1",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"prettier": "^2.8.4",
|
||||
"terser": "^5.46.1",
|
||||
"typescript": "~4.8.4",
|
||||
"unplugin-auto-import": "^0.15.3",
|
||||
"unplugin-vue-components": "^0.24.1",
|
||||
|
||||
@@ -40,7 +40,7 @@
|
||||
v-if="!isCompleted && !isExpired"
|
||||
:class="{ mobile: isMobile, tablet: isTablet }"
|
||||
>
|
||||
<div class="form-header" v-if="showStep(0)">
|
||||
<div class="form-header" v-if="showStep(0) && isMobile || isTablet">
|
||||
<div class="form-title poppins-bold">
|
||||
{{ t('AwardApply.emailVerification') }}
|
||||
</div>
|
||||
|
||||
123
vite.config.ts
123
vite.config.ts
@@ -7,7 +7,7 @@ import Components from 'unplugin-vue-components/vite'
|
||||
import DefineOptions from 'unplugin-vue-define-options/vite'
|
||||
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
|
||||
import path from 'path'
|
||||
import { ElementPlusResolver, AntDesignVueResolver } from 'unplugin-vue-components/resolvers'
|
||||
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers'
|
||||
|
||||
// console.log(process)
|
||||
// console.log(import.meta.env.VITE_APP_URL)
|
||||
@@ -16,14 +16,14 @@ import { ElementPlusResolver, AntDesignVueResolver } from 'unplugin-vue-componen
|
||||
|
||||
export default defineConfig(({ mode }) => {
|
||||
const env = loadEnv(mode, process.cwd())
|
||||
const isProduction = mode === 'production'
|
||||
|
||||
return {
|
||||
plugins: [
|
||||
vue(),
|
||||
DefineOptions(),
|
||||
// ...
|
||||
AutoImport({
|
||||
resolvers: [ElementPlusResolver()],
|
||||
resolvers: [],
|
||||
imports: [
|
||||
'vue',
|
||||
'vue-router',
|
||||
@@ -44,17 +44,15 @@ export default defineConfig(({ mode }) => {
|
||||
'isUndefined'
|
||||
]
|
||||
}
|
||||
],
|
||||
]
|
||||
}),
|
||||
Components({
|
||||
resolvers: [ElementPlusResolver(), AntDesignVueResolver({ importStyle: false })]
|
||||
resolvers: [AntDesignVueResolver({ importStyle: false })]
|
||||
}),
|
||||
createSvgIconsPlugin({
|
||||
// 指定需要缓存的图标文件夹
|
||||
iconDirs: [path.resolve(process.cwd(), 'src/assets/icons')],
|
||||
// 指定symbolId格式
|
||||
symbolId: 'icon-[dir]-[name]',
|
||||
inject: 'body-last' // 注入位置优化
|
||||
inject: 'body-last'
|
||||
})
|
||||
],
|
||||
define: {
|
||||
@@ -67,7 +65,6 @@ export default defineConfig(({ mode }) => {
|
||||
'primary-color': '#ec6800'
|
||||
},
|
||||
javascriptEnabled: true,
|
||||
// 全局导入less变量文件
|
||||
additionalData: `@import "${path.resolve(__dirname, 'src/assets/css/style.less')}";`
|
||||
}
|
||||
}
|
||||
@@ -79,19 +76,113 @@ export default defineConfig(({ mode }) => {
|
||||
}
|
||||
},
|
||||
server: {
|
||||
host: '0.0.0.0', // 允许局域网内的IP访问
|
||||
port: 8088, // 根据环境设置端口
|
||||
open: true, // 自动打开浏览器
|
||||
strictPort: true, // 如果端口已被占用,则尝试下一个可用端口
|
||||
host: '0.0.0.0',
|
||||
port: 8088,
|
||||
open: true,
|
||||
strictPort: true,
|
||||
hmr: {
|
||||
overlay: true
|
||||
},
|
||||
proxy: {
|
||||
'/api': {
|
||||
//'/api'是自行设置的请求前缀
|
||||
target: env.VITE_APP_URL,
|
||||
changeOrigin: true, //用于控制请求头中的host值
|
||||
rewrite: (path) => path.replace(/^\/api/, '/api') //路径重写,(正则)匹配以api开头的路径为空(将请求前缀删除)
|
||||
changeOrigin: true,
|
||||
rewrite: (path) => path.replace(/^\/api/, '/api')
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// ========== 打包配置 ==========
|
||||
build: {
|
||||
// 构建目标浏览器
|
||||
target: 'es2015',
|
||||
// 是否生成 sourcemap
|
||||
sourcemap: isProduction ? false : 'eval',
|
||||
// 打包文件输出目录
|
||||
outDir: 'dist',
|
||||
// 静态资源输出目录(相对于 outDir)
|
||||
assetsDir: 'assets',
|
||||
// 小于此阈值的导入将内联为 base64
|
||||
assetsInlineLimit: 4096,
|
||||
// 启用 CSS 代码分割
|
||||
cssCodeSplit: true,
|
||||
// 公共基础路径
|
||||
publicDir: 'public',
|
||||
// 启用 gzip 压缩大小限制
|
||||
chunkSizeWarningLimit: 500,
|
||||
// 自定义 chunk 分包策略
|
||||
rollupOptions: {
|
||||
output: {
|
||||
// 静态资源打包命名
|
||||
assetFileNames: (assetInfo) => {
|
||||
const info = assetInfo.name || ''
|
||||
if (/\.(woff|woff2?|eot|ttf|otf)$/i.test(info)) {
|
||||
return 'assets/fonts/[name]-[hash][extname]'
|
||||
}
|
||||
if (/\.(png|jpe?g|gif|svg|webp|avif|ico)$/i.test(info)) {
|
||||
return 'assets/images/[name]-[hash][extname]'
|
||||
}
|
||||
if (/\.(mp4|webm|ogg|mp3|wav|flac|aac)$/i.test(info)) {
|
||||
return 'assets/media/[name]-[hash][extname]'
|
||||
}
|
||||
return 'assets/[name]-[hash][extname]'
|
||||
},
|
||||
// chunk 分包命名
|
||||
chunkFileNames: 'assets/js/[name]-[hash].js',
|
||||
// 入口文件命名
|
||||
entryFileNames: 'assets/js/[name]-[hash].js',
|
||||
// 手动分包策略
|
||||
manualChunks: {
|
||||
// 核心框架
|
||||
'vue-core': ['vue', 'vue-router', 'pinia', 'pinia-plugin-persistedstate'],
|
||||
// 国际化
|
||||
'vue-i18n-core': ['vue-i18n'],
|
||||
// UI 框架
|
||||
'ant-design': ['ant-design-vue'],
|
||||
// 工具库
|
||||
'utils': ['lodash-es', 'axios'],
|
||||
// 其他依赖
|
||||
'vendor': ['gsap', 'crypto-js']
|
||||
}
|
||||
}
|
||||
},
|
||||
// 依赖预构建优化
|
||||
optimizeDeps: {
|
||||
include: [
|
||||
'vue',
|
||||
'vue-router',
|
||||
'pinia',
|
||||
'vue-i18n',
|
||||
'ant-design-vue',
|
||||
'axios',
|
||||
'lodash-es',
|
||||
'gsap',
|
||||
'crypto-js'
|
||||
]
|
||||
},
|
||||
// 压缩配置
|
||||
minify: 'terser',
|
||||
terserOptions: {
|
||||
compress: {
|
||||
drop_console: isProduction, // 生产环境移除 console
|
||||
drop_debugger: isProduction, // 生产环境移除 debugger
|
||||
pure_funcs: isProduction ? ['console.log'] : []
|
||||
},
|
||||
format: {
|
||||
comments: false // 移除注释
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 预览服务器配置
|
||||
preview: {
|
||||
host: '0.0.0.0',
|
||||
port: 8088,
|
||||
open: true,
|
||||
proxy: {
|
||||
'/api': {
|
||||
target: env.VITE_APP_URL,
|
||||
changeOrigin: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user