目录 前言一 eslint1.1. 局部安装eslint1.2 初始化配置文件1.3 安装步骤1.3.1 ESLint 风格 选Use a popular style guide1.3.2 遵循哪个标准 选Airbnb1.3.3 是否支持 React 选 y1.3.4 配置文件格式 选JSON 或 JavaScript1.3.5 提示安装依赖的库 选 y1.3.6 pakage.json文件会
目录1. eslint1. 使用vscode eslint插件2. 安装eslint包,运行eslint命令, 3. .eslintignore 文件忽略eslint检验的文件4. .eslintrc.js2. eslint vs prettier1. eslint我们的项目中经常有eslint + prettier,用来规范和校验js代码,用prettier用来格式化代码es
vscode 现在是前端开发主流的编辑工具,在使用过程中难免会遇到代码风格不统一导致的各种问题,如果你也有这方面的困扰,请仔细阅读这篇文章,或许对你有很大的帮助。
一、什么是Eslint 通过查看eslint官网(官网传送门),我们就可以知道,eslint就是一个用来识别 ECMAScript/JavaScript 并且按照规则给出报告的代码检测工具
前言:大多数人一说起eslint是做语法规则校验的,prettier是代码格式化的,vetur是负责.vue文件的语法高亮,格式化等等,好像都知道哦,但是经不起细问,就好像又不明白了。包括网上一搜,各种配置一大堆,乱七八糟,根本没有一个线性梳理,真是让人头大。平时我们都是去复制别人的就得过且过的用着 ...
转载
2021-09-02 18:58:00
524阅读
2评论
一、vue语法高亮 1.1 安装Vetur 1. 创建.vue文件, 写些代码, 发现一片漆黑 2. 安装激活vetur插件, 代码就有高亮了. 右键菜单还会变多一些, 主要多了个格式化文档. 这里配置了多个格式化的,所以会有多个。 看下vetur的特性: 语法高亮, 代码片段(emmet给我的感觉 ...
转载
2021-08-12 14:17:00
496阅读
2评论
当你利用脚手架在创建vue项目时,无脑创建下默认一定会安装eslint代码检测工具。那么你的噩梦就来了。eslint作为代码规范检测,不得不承认它的强大,但是绝对是会逼死一众强迫症患者。 比如你只是简简单单运行一个vue项目,报错一大堆,是不是瞬间就头大了。不过,仔细看一下就知道,这种报错很明显就是eslint检测的结果。所以,对症下药。 1.解决方法:源头解决&n
转载
2024-02-28 10:11:50
783阅读
ESLint 项目中的个人配置文件 .eslintrc.jsmodule.exports = {
// 解析ES6
'parser': 'babel-eslint',
'parserOptions': {
// 启用ES8语法支持
'ecmaVersion': 2017,
// module表示ECMAScript模块
'sour
本文介绍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阅读
"no-alert": 0,//禁止使用alert confirm prompt
"no-array-constructor": 2,//禁止使用数组构造器
"no-bitwise": 0,//禁止使用按位运算符
"no-caller": 1,//禁止使用arguments.caller或arguments.callee
"no-catch-shadow": 2,//禁止catch子句参数与外部作
转载
2024-10-30 16:57:04
40阅读
Study Notes
本博主会持续更新各种前端的技术,如果各位道友喜欢,可以关注、收藏、点赞下本博主的文章。规范化标准规范化是我们践行前端工程化中重要的一部分为什么要有规范化标准软件开发需要多人协同不同开发者具有不同的编码习惯和喜好不同的喜好增加项目维护成本每个项目或者团队需要明确统一的标准哪里需要规范化标准代码、文档、甚至是提交日志开发过程中人为编写的成果物代码标准化规范最为重要常见的规范化实
转载
2024-04-30 22:09:20
72阅读
最近在使用ts,发觉tslint在vscode上使用很不方便,不如eslint一键格式化高效,就想着能不能配置下vscode让其像写js一样爽
这篇文章主要解决2个问题,第一个是如何让vscode使用ts的lint,第二个是如何配置才能让eslint和prettier这2个代码格式化的vscode插件不互相冲突vscode使用ts的lint首先ts的lint已经不用tslint了,这个东东官方已经
转载
2024-04-18 09:54:00
100阅读
背景在开发前端项目时,每个人的开发习惯不同,用的IDE也不同,有的人喜欢用VSCode,有的人喜欢用Webstorm,而各个编译器默认的格式化规则有不一致,这就导致了不同IDE格式化出来的代码是不一样的。甚至有些人不喜欢格式化代码,导致代码看起来会比较乱,作为有点强迫症的我看着实在是很不习惯,一般我上手代码的第一件事就是习惯格式化一下。当多个团队一起开发同一个项目时,会涉及到分支之间代码合并的问题
转载
2024-04-22 12:02:34
85阅读
ESLint 是一个广泛使用的 JavaScript 代码检查工具,可以帮助开发者在编写代码时发现并修复潜在的问题和错误。在 第一步 创建工程 时虽然已经选择了包含 ESLint 预设配置,但还需要做一些调整,让我们使用起来能够更加的丝滑。vue.config.js 检测开关和模式module.exports = {
// 是否每次保存时 lint 代码,可选值 (boolean | 'war
一、中介者模式简介(Brief Introduction)中介者模式(Mediator Pattern),定义一个中介对象来封装系列对象之间的交互。中介者使各个对象不需要显示地相互引用,从而使其耦合性松散,而且可以独立地改变他们之间的交互。 Define an object that encapsulates how a set of objects interact. Mediator prom
想起自己刚入行的时候,从svn上把代码checkout下来,看到同事写的代码,大括号居然换行了。心中暗骂,这个人是不是个**,大括号为什么要换行?年轻气盛的我,居然满腔怒火,将空行一一删掉。 但是关于代码风格,我们很难区分谁对谁错,不同的人有不同偏好,唯有强制要求才能规避争论。所以,团队关于代码风格必须遵循两个基本原则:少数服从多数;用工具统一风格。本文将介绍,如何使用ESLint + Prett
前言我之前好多次都是一步一步的安装eslint和prettier及相关依赖,一个配置文件一个配置文件的粘贴复制,并修改其中的相关配置。而且可能会在每个项目中都要去处理,如果项目工程规划化以后,eslint和prettier确实是项目少不了的配置。不知道你有没有像我一样操作过呢?那么有没有一种更简单的方式去处理呢?答案是我终于遇到了。通过若川大佬的源码共读活动发现了,真的是太棒了。本文以vite脚手
1.三者都是干什么的(1)eslint
eslint它是一个代码检测工具,用来检测你代码中的不规范,可以统一项目项目的代码规范。如果你的代码不符合规范要求,就会直接在文件中出现不同程度的提示信息。具体是:
error:错误,报错文件名在vscode里会直接变红,直到错误改掉。
warning:警告,报警告的文件会在vscode里变成警告的黄色。
off:这个规则不进行校验,即关闭这个校验。(2)p
转载
2024-03-11 17:56:56
644阅读
{
"env": {
"browser": true,
"es2021": true,
"commonjs": true,
"es6": true,
"node": true
},
"extends": [
"eslint:recommended",
"plugi
转载
2024-04-26 11:07:32
56阅读
大浪淘沙,前段构架工具也在一代代的更迭,最终脱颖而出的是 Prettier 和 ESLint。很多人说这两个有很多重复功能,但其实这两个工具的侧重点是不一样的:Prettier 注重的是代码的格式化,也就是让团队有一个统一的代码规范。ESLint 注重的则更多是代码的质量,保证的是代码的安全性。这一点在 Prettier 的官网上有很好的说明:Linters have two categories
转载
2024-03-07 15:52:52
194阅读