前端项目
文章平均质量分 68
南麟剑首
前端开发
展开
-
多人协作项目代码规范统一约定(完整全面)
强制代码校验:eslint强制代码formate:prettier统一提交信息格式:commitizengit钩子监听:husky代码自动修复工具:lint-staged原创 2023-12-18 10:40:21 · 1329 阅读 · 0 评论 -
微前端-qiankun-落地指北
微前端落地指北原创 2022-01-04 16:36:14 · 1206 阅读 · 3 评论 -
eventbus-免手动解绑方案
为什么会写这个包?跨层级组件传值,平级组件传值方案众多,五花八门,维护起来很费劲(如eventbus,inject-provider等等)vuex?redux?注意了,这两个技术产生的应用场景是全局数据管理,而不是用来处理大量业务数据监听,如果坚持用,那么最后随着项目庞大,store也会庞大,维护成本不言而喻。嗯~modules可以分模块维护,但是,依旧不建议,做技术的严谨性还是要有的eventbus不是可以解决以上问题嘛?没错的,但是会有一个问题,很多同学协作开发过程代码不规范,那就是只监听,不解原创 2021-09-06 17:57:36 · 335 阅读 · 0 评论 -
判断windows系统类型和IE浏览器版本
判断系统类型,IE版本 function detectOS() { var sUserAgent = navigator.userAgent var isWin = navigator.platform == 'Win32' || navigator.platform == 'Windows' var isMac = navigator.platform == 'Mac68K' || naviga原创 2021-07-16 19:09:43 · 406 阅读 · 0 评论 -
0-1实现CI/CD [ 第一章 ]
什么是CICI 的意思是 持续构建 。负责拉取代码库中的代码后,执行用户预置定义好的操作脚本,通过一系列编译操作构建出一个 制品 ,并将制品推送至到制品库里面。常用工具有 Gitlab CI,Github CI,Jenkins 等。这个环节不参与部署,只负责构建代码,然后保存构建物。构建物被称为 制品,保存制品的地方被称为 制品库什么是CDCD 则有2层含持续部署(Continuous Deployment)持续交付(Continuous Delivery) 。持续交付 的概原创 2021-06-27 21:49:44 · 357 阅读 · 2 评论 -
富文本编辑器-tinymce的各种应用
为什么用这个编辑器?pc和H5皆可,纯粹的html?vue?angular?react?皆可简单,直接,输出dom功能强大,你想要的几乎都有了安装这里建议下载源码到本地使用下载地址然后引入js你的路径+/tinymce/js/tinymce/tinymce.min.js初始化tinymce.init({各种配置})配置项随心所欲吧自定义配置选择H5H5的基本配置框架中使用?vue,react,anular以及其他框架怎么用?Java,python等等也行哟汉化包也给你原创 2021-05-26 15:54:15 · 1622 阅读 · 0 评论 -
vue.config.js常用基础配置留档
1.分享一个vue.config.js的基本配置,至少能让你的代码体积缩小2/3,嗯,就这样,复制急用const CompressionPlugin = require('compression-webpack-plugin') // 代码压缩const UglifyJsPlugin = require('uglifyjs-webpack-plugin') // 去掉打印,注释等多余代码const { HashedModuleIdsPlugin } = require('webpack') // 只打原创 2021-03-26 16:12:59 · 210 阅读 · 0 评论 -
vue组件库和组件文档生成
公司现役组件库项目,公共资源或者新老项目切换仓库调整 src 目录结构|--src|-- App.vue|-- main.js|-- packages // 新建此文件夹用来存放组件 |-- index.js // 组件入口 |-- button.vue // 新增一个button组件,记得带上name |-- icon // 新增一个icon组件,记得带上namepackages/index.js// 所有组件的入口import原创 2021-03-09 20:52:18 · 3248 阅读 · 1 评论 -
部署npm私服-verdaccio 基于nginx
服务器:linux系统环境:centos 7软件环境:node安装nodejssudo yum install epel-releasesudo yum install nodejsnode --versionnode版本问题版本管理工具:nnpm install -g n安装指定版本:n 版本关于node版本n 会列出所有安装的版本供你切换n latest 安装最新版本n stable 安装最新稳定版n lts 安装最新长期支持版本n rm [版本号] 删除某一版本原创 2021-03-05 13:44:15 · 1253 阅读 · 0 评论 -
js常用函数封装和vue开发小技巧(持续添加)
移动端适配方案viewport插件选择 postcss-px-to-viewport配置 //安装插件 npm i postcss-px-to-viewport -D //根目录新建 .postcssrc.js // 文件内容 const path = require('path')module.exports = ({ file }) => { // 记住这里:设计搞多大就给多大,然后剩下的就按照设计稿实际宽高,写就好了 let designWidth =原创 2021-01-12 14:26:16 · 465 阅读 · 0 评论 -
vue怎么支持seo?
前言:首先明确一个知识点,为什么vue对seo支持不友好?其次仅仅vue对seo 的支持不好吗?react呢?angular呢?答:凡是spa项目对seo都非常不友好,为什么?这个跟网络爬虫有关跟spa的特性有关。第一,网络爬虫喜欢收录原创内容,于是乎我们很常用的手段就是发文章,原创或者伪原创去勾搭爬虫引起爬虫的重视,以此增长网站的权重对吧?但是spa呢偏偏收录不了,为什么?因为spa是单文件内容,意思是项目打包后,只有一个index.html对吧,此时你写一个文章页面如:article/1.html 这个原创 2021-01-11 18:29:26 · 841 阅读 · 1 评论 -
前端性能优化记录
渲染优化渲染优化是前端优化中一个很重要的部分,一个好的首屏时间能给用户带来很好的体验,这里要说的一点是关于首屏时间的定义,不同的团队对首屏时间定义不一样,有的团队认为首屏时间就是白屏时间,是从页面加载到第一个画面出现的时间。但是当我们说到用户体验的时候,仅仅是这样还达不到效果,所以有的前端团队认为,首屏时间应该是从页面加载到用户可以进行正常的页面操作时间,那么我们就依照后者来进行说明js css 加载顺序说渲染优化之前,我们还需要说一个小插曲,就是比较经典的一道问题浏览器地址栏输入url发生了什么原创 2020-11-27 15:25:33 · 390 阅读 · 1 评论 -
part04~开发通用前端UI框架(主题,国际化,高效打包,单测,组件文档)
定制主题所谓定制呢,就是将封装一些跟页面整体设计色值或者特殊设计相关的通用的颜色或者圆角等信息封装成变量然后存储成一个文件,这样我们就可以直接引用文件,使用变量,从而降低代码冗余度https://www.antdv.com/docs/vue/customize-theme-cn/这是Antd已经封装好的所有的变量,可以直接使用https://github.com/vueCo...原创 2020-04-08 01:13:18 · 439 阅读 · 0 评论 -
part03~开发通用前端UI框架(图表封装,高效mock,请求封装,表单校验,图标管理)
封装图表组件我们选择免费的,功能比较多的 Echart,当然了你也可以选择 AntV,也有 highChart安装 echart: npm install echarts --save新建 chart 组件库:components->chart->Chart.vue但是此时有些问题,就是这个组件的数据渲染的一些功能,有很多异步的操作,所以你想针对这个 dom 去操作时...原创 2020-04-02 09:58:00 · 875 阅读 · 1 评论 -
part01~开发通用前端UI框架
通用企业级前端 UI 框架项目介绍此项目一套开箱即用的中后台前端框架,这个项目就从 0 到 1 实现该项目优点:功能齐全从零搭建前端架构,提高你的单兵作战的能力技术点应用全面,综合查缺补漏关于权限管理是个大亮点哟template 和 jsx 的区别templateHTML 扩展的语法数据使用 Mustache(双括号)优点:学习成本低,大量指令,组件作用域...原创 2020-03-25 10:02:52 · 2809 阅读 · 0 评论