🗿

MONOREPO 模版

配置

• 🚀 Vue 3，Vite 4，PNPM
• 👍 TypeScript
• 📚 VueUse
• 🧩 Element Plus
• 🔁 Axios
• 🍍 Pinia
• 🚦 Vue Router
• 🌡️ NProgress

插件

• vite-plugin-eslint - Vite 的 ESLint 插件

• vite-plugin-compression - 使用 gzip 压缩资源

• vite-plugin-mock - Mock 接口插件

• unplugin-auto-import - 按需自动导入

• unplugin-vue-components - Vue 的按需组件自动导入

• husky - git hook

  • lint-staged - 针对暂存的git文件运行linter
  • stylelint - 强大的 CSS linter 可以帮助您避免错误并强制执行约定

• Visuallize - 可视化您的bundle

编码风格

• ESLint
  • @ecomfe/eslint-config
  • prettier
• Stylelint
  • @ecomfe/stylelint-config

单元测试

• Vitest - 一个 Vite 原生的单元测试框架
  • jsdom - 模拟 DOM 和浏览器 API
  • Vue Test Utils - Vue 3 的官方测试套件

使用

git clone https://github.com/GenerQAQ/vite-monorepo.git my-vite-app
cd my-vite-app
pnpm i

开发

只需要执行以下命令就可以在终端中看到Local地址

pnpm start

构建

构建该应用只需要执行以下命令

pnpm build:all

然后你会看到用于发布的 dist 文件夹被生成 stats.html是打包文件内容分析

Todo List

• 思考要不要加Tailwind css