vite+vue3+ts报错

1.使用别名需要用到node的path，vite.config.ts 提示找不到对应模块

npm install @types/node --save-dev

2.报错unable to verify the first certificate at TLSSocket.onConnectSecure

采用接口https必须配置 HTTPS& 自签名证书

• 在自己选一个文件的地方创建新文件夹，生成ca证书mkcert create-ca 再生成cert证书 mkcert create-cert
• 将刚刚生成的cert.crt和cert.key两个拷贝到项目的src/ssl文件夹中，没有可以新建一个ssl目录
• vue3在vite.config.js中写入以下关键代码

server: {
      https: {// 是否开启 https
        // 主要是下面两行的配置文件，不要忘记引入 fs 和 path 两个对象
        cert: fs.readFileSync(path.join(__dirname, 'src/ssl/cert.crt')),
        key: fs.readFileSync(path.join(__dirname, 'src/ssl/cert.key'))
      },
      // secure必须设置，不然一直报错unable to verify the first certificate at TLSSocket.onConnectSecure
      proxy: {
        '/api': {
          target: baseUrl,
          changeOrigin: true,
          secure: false,//如果您想验证SSL证书
          rewrite: (path) => path.replace(/^\/api/, '')
        }
      }
    }

https://blog.csdn.net/xfjpeter/article/details/121480873

备用图片

1669096650857.png

1669096682369.png

3.获取环境env

const ENV = loadEnv(mode, process.cwd())

4.动态路由

import.meta.glob 函数从文件系统导入多个模块

const modules = import.meta.glob('../views/**/**.vue')
const routerPackag = (routers:any) => { // 动态添加可访问路由表
  if (routers) {
    routers.filter((itemRouter:any) => {
      if (itemRouter.component) {
        if (itemRouter.component === 'layout') { // Layout组件特殊处理
          router.addRoute({ name: 'layout', path: '', component: modules['../views/layout/index.vue'] })
        } else {
          router.addRoute('layout', { // 是父组件 add-route添加进父组件chilren里
            // path: '/:code' + itemRouter.path,
            path: itemRouter.path,
            name: itemRouter.component_name,
            meta: { ...itemRouter.meta },
            component: modules[`../views/${itemRouter.component}.vue`]
          })
        }
      }
      if (itemRouter.children && itemRouter.children.length) {
        routerPackag(itemRouter.children)
      }
      return true
    })
    router.addRoute('NotFound', {
      path: '/:pathMatch(.*)*',
      redirect: '/404'
    })
  }
}