同步操作将从 sssx_li/vue-vite-template 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
pnpm install
TypeScript Vue Plugin(Volar)
Vue Language Features(Volar)
Eslint
Stylelint
Prettier - Code formatter
EditorConfig for VS Code
UnoCss
开发时建议将 vite.config.ts 中 dts: './typing/auto.import.d.ts',
、dts: './typing/auto.components.d.ts'
放开(取消注释) 以及将 eslintrc
下的 enabled
设置为 true
。这样开发时可以自动生成组件及、部分方法的ts类型声明及eslint校验配置
pnpm run dev
pnpm run build
pnpm run lint
e.g.: git commit -m "docs: update README.md"
Type | 作用 |
---|---|
feat | 新增特性 |
fix | bug 修复 |
perf | 改善性能 |
test | 测试 |
docs | 修改文档 |
style | 代码格式修改 |
refactor | 代码重构 |
build | 变更项目构建或外部依赖 |
ci | 更改持续集成软件的配置文件和 package 中的 scripts 命令 |
chore | 变更构建流程或辅助工具 |
revert | 代码回退 |
基于vite、vue3
集成vue-router、vueuse、pinia、typescript、mockjs
集成ESlint、Prettie、Stylelint代码规范工具。
集成commitlint git信息提交规范工具
集成国际化vue-i18n
集成主题切换功能(cssVar)
集成多种动态svg图标使用:封装SvgIcon组件、集成unplugin-icons
封装多种通用hooks
自定义指令(directive)及过滤属性(filter)封装及使用示例
generate
目前用于生成静态资源图片路径,即 src/assets/imgs 目录下的图片资源(为 src/utils/getImgUrl 函数参数提供类型声明)
mock
用于 mock 数据供项目使用
typing
存放全局变量/属性声明
src(核心代码存放位置)
assets(静态资源文件)
存放图片、字体等资源文件
components
存放全局通用组件
constants
存放全局常量
directives 存放全局指令函数
filters
存放全局过滤函数
hooks
存放全局 hook
i18n
存放国际化配置
router
存放路由配置
service
存放网络请求相关内容
store
存放状态管理
styles
存放全局样式
typing
存放公用变量/属性类型声明及类型转换函数
utils
存放全局工具函数
views 存放页面组件
main/master: 用于基础功能开发
element-template: 集成element-plus
antd-template: 集成ant-design-vue
*-scope: 用于cli工具模板生成
1. 下载svg文件,并存放在src/assets/svgs目录下(该项目指定在此目录,可以在vite.config.js文件中进行修改)
2. 使用: i-sy-{{svgName}}
<!-- i 及 sy (前缀名)均可在vite.config.js进行修改,根据个人喜好设置(具体请查看使用说明:https://github.com/antfu/unplugin-icons) -->
<i-sy-vue />
项目中引入的图集unplugin-icons会自动进行安装,可直接使用
1. 在官方网站找到想用的图标
2. 复制图集及icon名, 例: clarity:accessibility-1-solid; 图集为clarity,图标名为accessibility-1-solid
<i-clarity:accessibility-1-solid/>
or
<i-clarity-accessibility-1-solid/>
// 动态使用的svg存放在src/assets/svgs 目录下。根据svg图标名传入相应的参数, 同时支持修改图标颜色(修改颜色前请先删除svg代码里的fill属性,否则color属性将失效)。例:
<svg-icon name="vue" style="color: #f60" />
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。