Vue的第三方组件库非常多，最优秀的就是Element-Plus和AntDesign，当然还有其他大厂出品的KPI项目，我们打算使用大佬推荐过的一个UI库-NaiveUI。这个库的引入和安装非常简单，官网上有详细的说明。NaiveUI安装与使用pnpminstallnaive-ui很多组件库都提供了全局引入和按需引入等配置方式，我们当然都推荐使用按需引入，按需引入有两种方式，一种是在页面手动引入需要使用的库，另一种自动按需引入，使用unplugin-auto-import和unplugin-vue-components库，虽然这种方式使用起来方便，但是按需引入的时候加载会比较慢，所以我们推荐使
问题VSCode安装UnoCSS插件之后，鼠标悬停有提示，但输入时类名无智能提示。解决方案声明：以下解决方案亲测有效，但因环境不同无法保证对您也100%生效，望理解。重启VSCode；修改UnoCSS配置，开启代码智能提示：依次打开File→Preferences→Settings→搜索UnoCSS→Editinsettings.json打开setting.json文件查看editor.quickSuggestions配置是否开启代码提示如果没有editor.quickSuggestions节点，请添加："editor.quickSuggestions":{"other":true,"comm
Unocss简单使用首先初始化一个vite项目使用pnpm安装pnpmcreateviteunocss-demo----templatevue-ts使用npm安装npminitvite@latestmy-vue-app----templatevue使用yarnyarncreatevitemy-vue-app--templatevue下载Unocss依赖安装unocss和三个预设，第一个是工具类预设，第二个是属性化模式支持，第三个是icon支持pnpmi-Dunocss@unocss/preset-uno@unocss/preset-attributify@unocss/preset-icons
前言：不了解unocss的朋友，建议先阅读此文章https://antfu.me/posts/reimagine-atomic-css-zh简单来说，unocss是一个css引擎，用过TailwindCSS和windiCSS的不会陌生，不一样的是，unocss本身不提供任何类名css，它只是解决Tailwind以及windi的编译和打包的某些问题，也就是它可以配合Tailwind或者windi使用，以提供更快的编译打包速度。安装unocss的github地址为https://github.com/unocss/unocss，能力强的朋友可根据github文档进行安装。npmi-Dunocss或
UnoCSSUI项目地址前言Monorepo项目架构UnoCSSUI的模块设计PNPMMonorepo常用操作:--filter,-wMonorepo中的依赖管理项目整体结构基于原子化CSS的组件封装方式原子化CSS基础原子化VS内联样式原子化VSclass原子化对组件封装的影响@unocss-ui/components@unocss-ui/presetsafelisttheme组件库的开发与测试exampledemo基于GithubActions的自动部署推送npm包其他生态基于UnoCSSUI的开源项目TODO项目地址Github地址：https://github.com/cherryfu
CSS样式太多，重复写在学习UnoCSS之前，我提出几个问题：你是否有过写完了HTML之后，跳转到style写CSS这样来回跳转的痛苦？你是否有过不知道如何给节点取类名的痛苦（有的节点确实没啥必要取类名，但就是需要写CSS）？你是否有过管理重复、繁杂、繁多的CSS而痛苦？以上三个问题，在你使用了UnoCSS之后，基本上可以解决掉。使用UnoCSS可以更加快速地构建你的HTML和样式。这是UnoCSS作者对CSS的感想：重新构想原子化CSS。有兴趣可以先去读一读。文章中有一个关键词“原子化”，使用了之后才可能对这个关键词有反应。对CSS原子化的理解我们写CSS时，通常都是类名、id、标签选中之后
CSS样式太多，重复写在学习UnoCSS之前，我提出几个问题：你是否有过写完了HTML之后，跳转到style写CSS这样来回跳转的痛苦？你是否有过不知道如何给节点取类名的痛苦（有的节点确实没啥必要取类名，但就是需要写CSS）？你是否有过管理重复、繁杂、繁多的CSS而痛苦？以上三个问题，在你使用了UnoCSS之后，基本上可以解决掉。使用UnoCSS可以更加快速地构建你的HTML和样式。这是UnoCSS作者对CSS的感想：重新构想原子化CSS。有兴趣可以先去读一读。文章中有一个关键词“原子化”，使用了之后才可能对这个关键词有反应。对CSS原子化的理解我们写CSS时，通常都是类名、id、标签选中之后
