前两篇文章分享了基于 vite3 vue3 的组件库基础工程 vue3-component-library-archetype 和用于快速创建该工程的工具 yyg-cli,但在中大型的企业级项目中,通常会自主搭建这些脚手架或加速器.优雅哥希望每位前端伙伴能知其所以然,故接下来的文章将进入 Vue3 企业级优雅实战 系列,整个系列将包括五大部分: 首先会分享如何从 0 开始搭建一套组件库基础工程,即如何从 0 实现 vue3-component-library-archetype. 1 组件库工程…

前文已经初始化了 workspace-root,从本文开始就需要依次搭建组件库.example.文档.cli.本文内容是搭建 组件库的开发环境. 1 packages 目录 前面在项目根目录下创建了 packages 目录,该目录存放组件库的所有组件及组件库的入口.该目录中已经创建了两个子目录 foo 和 yyg-demo-ui.这两个目录是干嘛用的呢? 1.1 foo 目录 foo 目录代表一个示例组件,后面咱们会使用该组件来测试组件库在 example 和组件库文档中是否能正常运行.后续要开…

上文已经搭建了 pnpm + monorepo 的基础环境,本文对 workspace-root 进行初始化配置,包括:通用配置文件.公共依赖.ESLint. 1 通用配置文件 在项目 根目录 下添加下面的配置文件. 添加 .editorconfig 编辑器格式配置文件 [*.{js,cjs,ts,jsx,tsx,vue,html,css,scss,md}] indent_style = space indent_size = 2 trim_trailing_whitespace = true…

在前一篇文章中分享了搭建组件库的基本开发环境.创建了 foo 组件模块和组件库入口模块,本文分享组件库的样式架构设计. 1 常见的 CSS 架构模式 常见的 CSS 架构模式有很多:OOCSS.ACSS.BEM.SMACSS.ITCSS 等,其中 SMACSS 和 ITCSS 很相似.我在企业级项目中最常使用的是简化版的 ITCSS + BEM + ACSS,所以本文首先介绍这三种模式,其他模式大家自己上网查看. 1.1 ACSS ACSS 模式几乎是一个样式属性就对应了一个样式类.这种方式非常…

在写本系列的过程中,了解得越多越不知道从哪里做为切入点来写,几乎每个知识点展开来说都可以写成一本书.而自己在写作与文档编写方面来说,还是一个初鸟级别,所以只能从大方面说说,在本框架开发所需的范围内来讲述相关要用到的知识点,至于要更深入的去了解,请大家观看其他大牛的博客或购买书籍来学习. 为了加快进度,会对目录进行修改,将一些知识点合并或在后面使用的章节再进行描述. 谢谢大家的支持,如果您觉得本文对您有所帮助,请帮忙点击支持或发表评论. 在开发的过程中,要编写各种各样的文档,当然也有不少公司根本就…

.Net Core3.0 WebApi 项目框架搭建:目录 为什么使用Swagger 随着互联网技术的发展,现在的网站架构基本都由原来的后端渲染,变成了:前端渲染.后端分离的形态,而且前端技术和后端技术在各自的道路上越走越远. 前端和后端的唯一联系,变成了API接口:API文档变成了前后端开发人员联系的纽带,变得越来越重要,swagger就是一款让你更好的书写API文档的框架. 没有API文档工具之前,大家都是手写API文档的,在什么地方书写的都有,有在confluence上写的,有在对应的项目…

(后续的文章 公众号会提前一周更新,欢迎关注文末的微信公众号:程序员搞艺术) 预览本文的实现效果: # gitee git clone git@gitee.com:cloudyly/dscloudy-admin-single.git # github git clone git@github.com:cloudyly/dscloudy-admin-single.git git checkout 02_SVGIcon   本文主要描写如何让 Vue 工程支持 SVG 图标,以及如何获取 SVG 图…

从2018.1.开始参与了多个企业的中台建设,这些中台的技术选型几乎都是基于 Spring Cloud 微服务架构 + 基于 Vue 全家桶的前端.我前后端架构及开发我几乎各占一半的精力,在企业级前端开发中有一些心得体会:从使用组件库,到二次封装组件库.命令行加速器,再到业务开发.多个项目中发现有很多可复用或重复的内容,于是今年年初便着手搭建一套基础开发框架. 这套基础开发框架包括了一个中后台的通用功能,如 认证授权 (我使用 Spring Security + OAuth2 + JWT,前后端…

代码管理.版本管理是件老大难的事情,尤其多人开发中的代码冲突.突击功能时面临的 hotfix 等.本文只是简单说说如何将一套代码提交到两个 Git 平台(GitHub.GitEE)上.其他的 Git 操作:如本地 commit.远程 push.pull.开启新分支.分支合并等操作,再后面的文章中都会有操作 —— 每一个功能点我都会开启一个新分支. 1 初始化本地 Git 仓库 1.1 初始化仓库 将本地一个目录初始化为本地 git 仓库的命令是: git init   由于咱的工程是通过 vue…

本文出自EasyNetQ官方文档,内容为自己理解加翻译.文档地址:https://github.com/EasyNetQ/EasyNetQ/wiki/Quick-Start EasyNetQ简介 EasyNetQ是基于官方.NET组件RabbitMQ.Client 的又一层封装,使用起来更加方便,开发者不用关心具体队列声明,路由声明等细节,几句简单代码即可发送消息到队列,接收消息也很简单,下面将简单介绍EasyNetQ的使用方法.不知道什么是RabbitMQ?您可以关闭网页了. 安装EasyNe…