From 76345ec231bfb2644f12b9d2c00dd6c10dfc5891 Mon Sep 17 00:00:00 2001 From: Ryan Wang Date: Thu, 22 Sep 2022 21:56:12 +0800 Subject: [PATCH] feat: adding random suffix to static resources at build time (#618) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit #### What type of PR is this? /kind feature /milstone 2.0 #### What this PR does / why we need it: 在构建时，为静态资源添加随机字符串后缀。防止升级版本之后缓存不会及时更新。 #### Which issue(s) this PR fixes: #### Special notes for your reviewer: /cc @halo-dev/sig-halo-admin #### Does this PR introduce a user-facing change? ```release-note None ``` --- package.json | 2 ++ pnpm-lock.yaml | 25 +++++++++++++++++++++++++ vite.config.ts | 20 ++++++++++++++------ 3 files changed, 41 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index c8458141..3ea102d0 100644 --- a/package.json +++ b/package.json @@ -75,6 +75,7 @@ "@types/lodash.merge": "^4.6.7", "@types/node": "^17.0.45", "@types/qs": "^6.9.7", + "@types/randomstring": "^1.1.8", "@types/uuid": "^8.3.4", "@vitejs/plugin-vue": "^3.1.0", "@vitejs/plugin-vue-jsx": "^2.0.1", @@ -95,6 +96,7 @@ "postcss": "^8.4.16", "prettier": "^2.7.1", "prettier-plugin-tailwindcss": "^0.1.13", + "randomstring": "^1.2.2", "sass": "^1.54.9", "start-server-and-test": "^1.14.0", "tailwindcss": "^3.1.8", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7b7565ac..61bf994c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -28,6 +28,7 @@ importers: '@types/lodash.merge': ^4.6.7 '@types/node': ^17.0.45 '@types/qs': ^6.9.7 + '@types/randomstring': ^1.1.8 '@types/uuid': ^8.3.4 '@vitejs/plugin-vue': ^3.1.0 '@vitejs/plugin-vue-jsx': ^2.0.1 @@ -64,6 +65,7 @@ importers: prettier-plugin-tailwindcss: ^0.1.13 pretty-bytes: ^6.0.0 qs: ^6.11.0 + randomstring: ^1.2.2 sass: ^1.54.9 start-server-and-test: ^1.14.0 tailwindcss: ^3.1.8 @@ -138,6 +140,7 @@ importers: '@types/lodash.merge': 4.6.7 '@types/node': 17.0.45 '@types/qs': 6.9.7 + '@types/randomstring': 1.1.8 '@types/uuid': 8.3.4 '@vitejs/plugin-vue': 3.1.0_vite@3.1.3+vue@3.2.39 '@vitejs/plugin-vue-jsx': 2.0.1_vite@3.1.3+vue@3.2.39 @@ -158,6 +161,7 @@ importers: postcss: 8.4.16 prettier: 2.7.1 prettier-plugin-tailwindcss: 0.1.13_prettier@2.7.1 + randomstring: 1.2.2 sass: 1.54.9 start-server-and-test: 1.14.0 tailwindcss: 3.1.8_postcss@8.4.16 @@ -3036,6 +3040,10 @@ packages: resolution: {integrity: sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==} dev: true + /@types/randomstring/1.1.8: + resolution: {integrity: sha512-NPOJcW+TTjT9Qiog0UjSoG3Sj24c7EfzZO39BU9E61D7fQtwNmBNblyQhSsK9+5s9Fm0o31rvX+ZyZkpE/c7jA==} + dev: true + /@types/resolve/1.17.1: resolution: {integrity: sha512-yy7HuzQhj0dhGpD8RLXSZWEkLsV9ibvxvi6EiJ3bkqLAO1RGo0WbkWQiwpRlSFymTJRz0d3k5LM3kkx8ArDbLw==} dependencies: @@ -3657,6 +3665,11 @@ packages: engines: {node: '>=8'} dev: true + /array-uniq/1.0.2: + resolution: {integrity: sha512-GVYjmpL05al4dNlKJm53mKE4w9OOLiuVHWorsIA3YVz+Hu0hcn6PtE3Ydl0EqU7v+7ABC4mjjWsnLUxbpno+CA==} + engines: {node: '>=0.10.0'} + dev: true + /array.prototype.flat/1.3.0: resolution: {integrity: sha512-12IUEkHsAhA4DY5s0FPgNXIdc8VRSqD9Zp78a5au9abH/SOBrsp082JOWFNTjkMozh8mqcdiKuaLGhPeYztxSw==} engines: {node: '>= 0.4'} @@ -7394,12 +7407,24 @@ packages: resolution: {integrity: sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA==} engines: {node: '>=10'} + /randombytes/2.0.3: + resolution: {integrity: sha512-lDVjxQQFoCG1jcrP06LNo2lbWp4QTShEXnhActFBwYuHprllQV6VUpwreApsYqCgD+N1mHoqJ/BI/4eV4R2GYg==} + dev: true + /randombytes/2.1.0: resolution: {integrity: sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==} dependencies: safe-buffer: 5.2.1 dev: true + /randomstring/1.2.2: + resolution: {integrity: sha512-9FByiB8guWZLbE+akdQiWE3I1I6w7Vn5El4o4y7o5bWQ6DWPcEOp+aLG7Jezc8BVRKKpgJd2ppRX0jnKu1YCfg==} + hasBin: true + dependencies: + array-uniq: 1.0.2 + randombytes: 2.0.3 + dev: true + /read-cache/1.0.0: resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==} dependencies: diff --git a/vite.config.ts b/vite.config.ts index 044c4630..15f728a0 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -9,11 +9,17 @@ import { viteExternalsPlugin as ViteExternals } from "vite-plugin-externals"; import { viteStaticCopy as ViteStaticCopy } from "vite-plugin-static-copy"; import { createHtmlPlugin as VitePluginHtml } from "vite-plugin-html"; import Icons from "unplugin-icons/vite"; +import randomstring from "randomstring"; export default ({ mode }: { mode: string }) => { const env = loadEnv(mode, process.cwd(), ""); const isProduction = mode === "production"; + const staticSuffix = randomstring.generate({ + length: 8, + charset: "hex", + }); + return defineConfig({ base: env.VITE_BASE_URL, plugins: [ @@ -35,22 +41,24 @@ export default ({ mode }: { mode: string }) => { isProduction ? ".prod" : "" }.js`, dest: "assets/vue", - rename: "vue.global.js", + rename: `vue.global.${staticSuffix}.js`, }, { src: `./node_modules/vue-router/dist/vue-router.global${ isProduction ? ".prod" : "" }.js`, dest: "assets/vue-router", - rename: "vue-router.global.js", + rename: `vue-router.global.${staticSuffix}.js`, }, { src: "./node_modules/@halo-dev/admin-shared/dist/halo-admin-shared.iife.js", dest: "assets/admin-shared", + rename: `halo-admin-shared.iife.${staticSuffix}.js`, }, { src: "./node_modules/@halo-dev/components/dist/halo-components.iife.js", dest: "assets/components", + rename: `halo-components.iife.${staticSuffix}.js`, }, ], }), @@ -59,10 +67,10 @@ export default ({ mode }: { mode: string }) => { inject: { data: { injectScript: [ - ``, - ``, - ``, - ``, + ``, + ``, + ``, + ``, ].join("\n"), }, },