vite搭建项目上传

前言

学习下Java开发框架，搞了一个垃圾项目，构建好前端vue后想重构加后端springboot直接猪脑过载了，最后换了个简单项目学习中间逻辑，至于这个纯前端想了想还是传上来。印象里还是webpack的vue.config.ts时代，现在换vite了，直接gitpage托管手动上传的dist还不行，转向gh-pages傻瓜式打包上传。

有用的网址

https://start.spring.io/

https://dashboard.render.com/

https://vuejs.org/tutorial/

vite搭建项目在线展示

这里用githubpage，懒得贴图，详细参考：
➡➡➡😶‍🌫️⬅⬅⬅

github创建一个仓库，我这里是：https://alenirving.github.io/mbti/

#项目根目录下
git init
git remote add origin https://github.com/name/mbti.git

#验证
git config --get remote.origin.url

#修改vite.config.js
export default defineConfig({
  plugins: [vue()],
  base: '/mbti/', // 这里作修改，与仓库名一致
})

npm install -D gh-pages

#添加部署脚本到 package.json
{
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview",
    "deploy": "gh-pages -d dist"   // 相当于hexo deploy
  }
}

npm run build
npm run deploy

仓库-settings-Pages-Branch-gh-pages-Save

Actions查看构建情况