eslint

| A consistent experience is a better experience.——Mark Eberman | 一致的体验是更好的体验。——Mark Eberman 《摘自设计师的16句名言》 背景 1.UI一致性项目 积木（Tangram）Sketch插件源于美团外卖UI的一致性项目，该项目自2019年5月份被提出，是UI设计团队与研发团队共建的项目，目的是改善用户端体验的一致性，提升多技术方案间组件的通用性和复用率，整体降低视觉改版的研发成本。 一直以来，外卖业务都处于高速发展阶段，人员规模在不断扩大，项目复杂度在持续增加。目前平台承载了美团餐饮、商超、闪购、跑腿、药品等多个业务品类，用户入口也覆盖了美团App外卖频道、外卖App、大众点评等多个独立应用。因为客户端一直比较侧重业务开发，为了满足业务快速上线的需求，UI组件并没有统一的实现，而是分散到各个业务场景中，在开发过程中因UI缺乏同一的标准而导致以下问题不断凸显： UI/UE层面 ① UI缺乏标准化的设计规范，在不同App及不同语言平台上设计风格不统一，用户体验不一致。 ② 设计资源与代码均缺乏统一的管理手段，无法实现积累沉淀，无法适应新业务的开发需求。 RD层面 ① 组件代码实现碎片化，存在多次开发的情况，质量难以得到保证。 ② 各端代码API不统一，维护拓展成本较高，变更主题、适配Dark

DevUI是一支兼具设计视角和工程视角的团队，服务于华为云 DevCloud 平台和华为内部数个中后台系统，服务于设计师和前端工程师。 官方网站： devui.design Ng组件库： ng-devui （欢迎Star） 引言 重构，是我们开发过程中不可避免需要进行的一项工作。重构代码，以适配当前模块设计之初未考虑到的多样化场景，并增加模块的可维护性、健壮性、可测试性。那么，如何明确重构的方向，以及量化重构的结果呢？ 代码圈复杂度（Cyclomatic complexity，CC）可以是一个供选择的指标。 什么是圈复杂度 圈复杂度（Cyclomatic complexity，CC）也称为条件复杂度或循环复杂度，是一种软件度量，是由老托马斯·J·麦凯布（Thomas J. McCabe, Sr.）在1976年提出，用来表示程序的复杂度，其符号为VG或是M。圈复杂度即程序的源代码中线性独立路径的个数。 为何要降低模块(函数)的圈复杂度 下表为模块（函数）圈复杂度与代码状况的一个基本对照表。除了表中给出的代码状况、可测性、维护成本等指标外，圈复杂度高的模块（函数），也对应着高软件复杂度、低内聚、高风险、低可读性。我们要降低模块（函数）的圈复杂度，就是要降低其软件复杂度、增加内聚性、减少可能出现的软件缺陷个数、增强可测试性、可读性。 圈复杂度 代码状况 可测性 维护成本 1 - 10

vue环境配置简洁教程 https://blog.csdn.net/qq_36986067/article/details/107804670 1.安装node.js 在官网下下载对应的node.js版本，推荐下载mis(环境变量会自动配置），我这里下载的是 node-v12.18.3-x64.msi 中文网 http://nodejs.cn/ 下载完打开安装，可以更改安装目录（推荐不要安装在系统盘，我这里安装在 D:\nodejs ），一直点击下一步 安装完成，在命令行界面输入node -v 和 npm - v node.js安装成功 2.目录设置 在node.js安装目录下新建node_global和node_cache文件夹 命令行输入 npm config set prefix "D:\nodejs\node_global" 以及 npm config set cache "D:\nodejs\node_cache" 设置成功后用命令npm install XXX-g安装以后模块就在D:\nodejs\node_global\node_modules目录下 设置镜像网站 npm config set registry=http://registry.npm.taobao.org 输入以下命令可查看设置 npm config list 3.设置环境变量 path中添加D:

1. vscode 下载插件 eslint 2. 下载node 下载安装之后，全局安装eslint npm i eslint -g eslint -v 有版本号为安装成功 3.配置VsCode setting.json 可以 Ctrl+， 或者 // 启用Eslint "eslint.enable": true, // 保存时自动格式化代码 "editor.codeActionsOnSave": { "source.fixAll": false, "source.fixAll.eslint": true }, 3.配置eslint 两种配置：当前项目配置(只检查当前项目)和全局配置（检查所有用vscode打开的js,html …） 当前项目配置 ，先进入项目根目录 npm init -y //-y为忽略问答，直接创建pack.json eslint --init //初始化 ? How would you like to use ESLint? To check syntax only // 只检查语法 > To check syntax and find problems // 检查语法并发现问题 To check syntax, find problems, and enforce code style // 检查语法、发现问题并强制执行代码样式 ? What type of

最近在使用react过程中发现在使用ref时的一些场景，自己初步感觉react的ref没有vue那么强大。 现在我就简单看下怎么使用ref？ createRef 我们直接看源码 // node_modules/react/umd/react.development.js // an immutable object with a single mutable value function createRef() { var refObject = { current: null }; { Object.seal(refObject); } return refObject; } 其实 createRef 也没做什么，就是返回了一个对象 { current: null} ，但是在返回值之前进行了 Object.seal 操作 Object.seal() 方法封闭一个对象，阻止添加新属性并将所有现有属性标记为不可配置。当前属性的值只要原来是可写的就可以改变。 我们简单测试下 createRef使用场景 我们一般是在构造函数里面先新建个空的ref，为了方便在调试工具中查看，我们把ref放到state里面。 比如 import AsideMenu from './Menu.jsx'; export default class Layout extends React.Component {

背景 凹凸曼是个小程序开发者，他要在小程序实现秒杀倒计时。于是他不假思索，写了以下代码： 1 2 3 4 5 6 7 8 9 Page({ init: function ( ) { clearInterval( this .timer) this .timer = setInterval( () => { // 倒计时计算逻辑 console .log( 'setInterval' ) }) }, }) 可是，凹凸曼发现页面隐藏在后台时，定时器还在不断运行。于是凹凸曼优化了一下，在页面展示的时候运行，隐藏的时候就暂停。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 Page({ onShow: function ( ) { if ( this .timer) { this .timer = setInterval( () => { // 倒计时计算逻辑 console .log( 'setInterval' ) }) } }, onHide: function ( ) { clearInterval( this .timer) }, init: function ( ) { clearInterval( this .timer) this .timer = setInterval( () => { // 倒计时计算逻辑

Electron-vue取消代码检查Eslint 博客说明 文章所涉及的资料来自互联网整理和个人总结，意在于个人学习和经验汇总，如有什么地方侵权，请联系本人删除，谢谢！ 介绍 在项目运行的时候容易出现错误，特别是这种检查代码的，什么格式啊，甚至分号呀，一来就是一大推 方法一 在创建项目的时候不使用eslint 这里选择no 方法二 在.elerton-vue目录下里面的三个文件都修改一下 把有关eslint的都注释掉 记得要重新 npm run dev 感谢 万能的网络 以及勤劳的自己 来源： oschina 链接： https://my.oschina.net/guizimo/blog/4339669