要想让webpack为我所用,不仅要求我们在loader使用上得心应手,更离不开对plugins的熟练使用。如果说把webpack比喻成一台豆浆机,我们需要一杯豆浆喝,我们要:准备好原材料,好比我们的 entry 入口起点的处理;选择豆浆品种,好比我们在选择 loader 加载器;搅拌电机工作,好比我们 plugins 插件的大用处;完成倒出品尝,好比我们 output 输出文件的处理;电力保障在
转载
2024-09-17 10:49:22
63阅读
1.三者都是干什么的(1)eslint
eslint它是一个代码检测工具,用来检测你代码中的不规范,可以统一项目项目的代码规范。如果你的代码不符合规范要求,就会直接在文件中出现不同程度的提示信息。具体是:
error:错误,报错文件名在vscode里会直接变红,直到错误改掉。
warning:警告,报警告的文件会在vscode里变成警告的黄色。
off:这个规则不进行校验,即关闭这个校验。(2)p
转载
2024-03-11 17:56:56
644阅读
获取或提交代码时报错,如下,点击Quick Fix没有用 解决方案是: 运行命令:yarn run lint --fix ...
转载
2021-09-10 09:20:00
1380阅读
2评论
本文介绍ESlint & Prettier & Flow组合框架的构建,以及这样做的目的,过程以及运行示例 1.Flow是faceBook开源的一个JavaScript静态类型检查工具 2.Prettier:代码美化和统一规范工具 3. ESlint: 静态代码检查工具
FlowFlow的意义Flow是faceBook开源的一个JavaS
转载
2024-06-21 13:26:19
77阅读
注意:这个冲突问题一般是指在代码编辑器中出现的问题,这里使用的是vscode。在前端开发中,很多人使用 prettier 作为代码格式化工具,用 ESLint 控制代码风格,以及检查错误。但是在同时使用 ESLint 和 prettier 的时候,由于代码规则不一样就会发生冲突,发生冲突的原因是:在保存文件时,**ESLint 先修复了代码符合 ESLint 的代码风格,之后 prettier 又
转载
2024-03-25 10:13:38
714阅读
前言部分今天闲鱼技术团队开源了flutter应用框架Fish Redux我们看到越来越多的项目在接入使用flutter,相信未来Flutter会是混合开发的首选方案。我们知道在Android中经常会把用户的一些操作习惯或者是个人简单的信息存储到本地使用,以前我们都是基于SharedPreference来实现的简单存储,比如常用的登录状态、是否是夜间主题、软件版本等等。以前也是使用过ACache这个
转载
2024-05-15 06:44:30
128阅读
Flow的意义Flow是faceBook开源的一个JavaScript静态类型检查工具,作用类似TypeScript,但是它不像TS那样是一门独立的语言,而是作为一个babel-plugin,借助babel的编译切入JavaScript的编码当中,同时,与ts不同的是,Flow.js的类型检查不是强制的,可以通过//@flow手动开启,意味着,你可以自由选择某个文件是否开启类型检查。Flow真是眼
转载
2024-09-27 09:55:20
64阅读
首发 现在的项目前端都很很庞大,往往也是多人合作开发,对代码的格式规范或代码风格要求尤其重要,一个看着统一整齐的代码格式,也能在实际开发中起到事半功倍的作用,起码能起到心情愉悦的作用。本文结合自身在项目开发中的配置,记录一下Eslint和Prettier工具的配置和部分可能会遇到的问题,如有错误,请指正。Eslint和Prettier的区别两者的区别简单一句话介绍就是:Eslint或其他lint类
转载
2024-05-13 14:59:34
219阅读
前端代码规范工具ESLint和Prettier1. ESLint是什么?ESLint 是一个开源的 JavaScript 代码检查工具,由 Nicholas C. Zakas 于2013年6月创建。代码检查是一种静态的分析,常用于寻找有问题的模式或者代码,并且不依赖于具体的编码风格。对大多数编程语言来说都会有代码检查,一般来说编译程序会内置检查工具。JavaScript 是一个动态的弱类型语言,在
转载
2024-05-08 08:18:51
106阅读
划重点 eslint-config-prettier 禁用 eslint 冲突配置 eslint-plugin-prettier Prettier先格式化 (默认是先eslint格式化,再Prettier格式化)
原创
2022-08-29 17:24:58
4551阅读
点赞
需求使用prettier插件进行美化,使用eslint进行代码的校验,但是我们在vscode安装了着两个插件后发现会有冲突疑问Slint和Prettier格式化的区别?
eslint(包括其他一些 lint 工具)的主要功能包含代码格式的校验,代码质量的校验。而 Prettier 只是代码格式的校验(并格式化代码),不会对代码质量进行校验。代码格式问题通常指的是:单行代码长度、tab长度、空格、逗
转载
2024-03-16 01:24:35
249阅读
Study Notes
本博主会持续更新各种前端的技术,如果各位道友喜欢,可以关注、收藏、点赞下本博主的文章。规范化标准规范化是我们践行前端工程化中重要的一部分为什么要有规范化标准软件开发需要多人协同不同开发者具有不同的编码习惯和喜好不同的喜好增加项目维护成本每个项目或者团队需要明确统一的标准哪里需要规范化标准代码、文档、甚至是提交日志开发过程中人为编写的成果物代码标准化规范最为重要常见的规范化实
转载
2024-04-30 22:09:20
72阅读
ESLint 先说是什么:ESLint 是一个检查代码质量与风格的工具,配置一套规则,他就能检查出你代码中不符合规则的地方,部分问题支持自动修复。 使用这么一套规则有什么用呢?如果单人开发的话倒是没什么了,但是一个团队若是存在两种风格,那格式化之后处理代码冲突就真的要命了,统一的代码风格真的很重要!
转载
2020-09-17 15:38:00
127阅读
2评论
VSCode中ESLint、Prettier 配置冲突接收一个新的项目,然后在保存的时候遇到了如下问题的 鬼畜缩进 问题。开始的时候有点懵逼,什么鬼,通过阅读项目代码配置,发现了这个问题出现的原因,并给出解决方案。看到这种情况的第一反应是不是代码格式校验出问题了,再看看代码配置的代码检测,发现这个项目同时使用了ESLint和Prettier的,会不会是两种验证规则冲突了。网上一查确实有很多人遇到这
转载
2024-09-14 08:28:42
128阅读
一、中介者模式简介(Brief Introduction)中介者模式(Mediator Pattern),定义一个中介对象来封装系列对象之间的交互。中介者使各个对象不需要显示地相互引用,从而使其耦合性松散,而且可以独立地改变他们之间的交互。 Define an object that encapsulates how a set of objects interact. Mediator prom
Linters have two categories of rules: 代码修正一般有两种规则: Formatting rules: eg: max-len, no-mixed-spaces-and-tabs, keyword-spacing, comma-style... 格式化规则,例如:最
原创
2021-09-01 14:54:36
500阅读
Vue3 + TS + ESLint + Prettier配置模板当前前端代码规范,基本是ESLint + Prettier。ESLint和Prettier的区别ESLint: 代码质量检查, 检查不符合要求的代码语法错误, 比如使用了未声明的变量等。Prettier: 规范代码风格, 例如单双引号, 结尾是否加分号等。 ESLint也有一定的代码风格检查能力, 但是不及Prettier全面和专业
今天在使用vscode时候遇到一个小问题,就是编辑器每行多了一些波浪线?如图: 查一下相关文档,是在格式验证时候行尾
原创
2024-01-18 11:55:06
1174阅读
认识ESLint 使用ESLint npm install eslint -D npx eslint --init npx eslint ./src/main.js ESLint的文件解析 VSCode的ESLint插件 VSCode的Prettier插件 ESLint-Loader的使用 cnpm
转载
2021-03-10 16:04:00
296阅读
2评论
本文使用starter-kit:steamer-react react分支。此分支已集成react与preact。背景最近接手了互动视频的项目,做了一个月的运营活动。跟基础功能不同,运营活动更为轻量。因此许多同事并不想用那么“重”的React。但同时,大家由于之前度过React的上手痛苦期后,开始体会到React的许多好处,裸写运营活动的时候,又开始对React的好处念念不忘记:良好的组件化、解放
转载
2024-10-12 08:04:36
65阅读