feat: 改用 https,加快首次打开页面

Author: answer-huang

build/vite/index.ts

@@ -14,6 +14,9 @@ import viteCompression from 'vite-plugin-compression'
 import vueSetupExtend from 'vite-plugin-vue-setup-extend'
 import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'
 import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
+import mkcert from 'vite-plugin-mkcert'
+// import PkgConfig from 'vite-plugin-package-config'
+// import OptimizationPersist from 'vite-plugin-optimize-persist'
 export function createVitePlugins(VITE_APP_TITLE: string) {
   const root = process.cwd()
   // 路径查找
@@ -93,6 +96,9 @@ export function createVitePlugins(VITE_APP_TITLE: string) {
     }),
     ViteEjsPlugin({
       title: VITE_APP_TITLE
-    })
+    }),
+    mkcert(),
+    // PkgConfig(),
+    // OptimizationPersist(),
   ]
 }

package.json

@@ -6,7 +6,7 @@
   "private": false,
   "scripts": {
     "i": "pnpm install",
-    "dev": "vite --mode base",
+    "dev": "DEBUG=vite:plugin:mkcert vite --mode base --force",
     "ts:check": "vue-tsc --noEmit",
     "build:pro": "vite build --mode pro",
     "build:dev": "vite build --mode dev",
@@ -55,6 +55,9 @@
     "qs": "^6.11.0",
     "steady-xml": "^0.1.0",
     "url": "^0.11.0",
+    "vite-plugin-mkcert": "^1.13.0",
+    "vite-plugin-optimize-persist": "^0.1.2",
+    "vite-plugin-package-config": "^0.1.1",
     "vue": "3.2.47",
     "vue-i18n": "9.2.2",
     "vue-router": "^4.1.6",

src/types/auto-imports.d.ts

@@ -40,7 +40,6 @@ declare global {
   const ref: typeof import('vue')['ref']
   const required: typeof import('@/utils/formRules')['required']
   const resolveComponent: typeof import('vue')['resolveComponent']
-  const resolveDirective: typeof import('vue')['resolveDirective']
   const shallowReactive: typeof import('vue')['shallowReactive']
   const shallowReadonly: typeof import('vue')['shallowReadonly']
   const shallowRef: typeof import('vue')['shallowRef']
@@ -65,3 +64,8 @@ declare global {
   const watchPostEffect: typeof import('vue')['watchPostEffect']
   const watchSyncEffect: typeof import('vue')['watchSyncEffect']
 }
+// for type re-export
+declare global {
+  // @ts-ignore
+  export type { Component,ComponentPublicInstance,ComputedRef,InjectionKey,PropType,Ref,VNode } from 'vue'
+}

vite.config.ts

@@ -26,20 +26,20 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
     // 服务端渲染
     server: {
       // 是否开启 https
-      https: false,
+      https: true,
       // 端口号
       port: env.VITE_PORT,
       host: "0.0.0.0",
       open: env.VITE_OPEN === 'true',
       // 本地跨域代理
-      proxy: {
-        ['/admin-api']: {
-          target: env.VITE_BASE_URL,
-          ws: false,
-          changeOrigin: true,
-          rewrite: (path) => path.replace(new RegExp(`^/admin-api`), ''),
-        },
-      },
+      // proxy: {
+      //   ['/admin-api']: {
+      //     target: env.VITE_BASE_URL,
+      //     ws: false,
+      //     changeOrigin: true,
+      //     rewrite: (path) => path.replace(new RegExp(`^/admin-api`), ''),
+      //   },
+      // },
     },
     // 项目使用的vite插件。 单独提取到build/vite/plugin中管理
     plugins: createVitePlugins(env.VITE_APP_TITLE),