【源码】基于Vite的Vue3脚手架项目

项目简介

本项目是一个基于Vite的Vue3脚手架项目，致力于为开发者打造快速、现代化的前端开发环境。它结合了Vue3和Vite的最新特性，具备快速冷启动、实时热更新等功能，通过集成多种插件和工具，有效提升开发效率，保障代码质量与可维护性。

项目的主要特性和功能

1. 全局模块管理：利用inject('$utils')和inject('$api')引入全局工具函数与API接口对象；通过Vite的CSS配置管理全局样式；设有Mock模块，便于开发前期模拟接口。
2. 丰富的配置选项：支持Vue的Mixin、自定义指令等配置；提供多环境变量配置（开发、测试、生产环境）；集成Jest进行单元测试，可在Git钩子中自动运行测试。
3. 集成插件：借助postcss-px-to-viewport插件实现移动端自适应，自动将px单位转换为vw；使用unplugin-auto-import插件自动引入Vue3的API；通过rollup-plugin-visualizer插件生成包依赖分析报告；利用vite-plugin-compression插件对代码进行压缩。
4. 规范化开发：通过.editorconfig、.prettierrc和.eslintrc.js文件统一代码风格；使用husky、lint-staged、Commitizen和commitlint工具规范Git提交信息。
5. 部署：采用Docker进行项目部署，可通过修改Dockerfile和nginx.conf文件进行自定义配置；提供一键打包并上传至DockerHub的功能。
6. 全局组件：提供如common-icon之类的全局组件，方便开发者快速使用。

安装使用步骤

下载源码文件

假设用户已经完成此步骤。

安装依赖

在项目根目录下运行以下命令安装项目所需的所有依赖： bash yarn 或 bash npm install

运行项目

在项目根目录下运行以下命令启动项目： bash yarn dev 或 bash npm run dev 项目启动后，可在浏览器中访问本地的网址进行预览。

开发规范

请遵循项目的代码规范和提交规范进行开发，以确保项目的质量和可维护性。使用yarn cz命令进行规范的Git提交。

部署

如需部署到生产环境，请按照以下步骤操作： 1. 修改Dockerfile和nginx.conf文件中的配置。 2. 运行以下命令进行打包并上传至DockerHub： bash yarn release

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】