esLint基础使用

已于 2022-01-21 14:34:15 修改
阅读量2.2k 收藏 3
点赞数
分类专栏： 前端工具、插件 文章标签： esLint基础使用
于 2021-12-08 01:37:17 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/GTbond/article/details/121781928
版权

esLint基础使用

1）修改vscode 设置

修改tab空格设置；tabsize配置项为2

在这里插入图片描述

format 自动保存代码

在这里插入图片描述
2）在vue创建项目中，选择eslint+Standard config -标准规范-
在这里插入图片描述

在保存时就开启检查

最低0.47元/天 解锁文章
GG·bond
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
eslint使用方法
年少轻狂
12-29 647
Visual Studio Code（VSCode） vue、vue-cli、npm、ESLint 1.安装依赖 npm install eslint eslint-config-airbnb-base eslint-plugin-import eslint-plugin-vue --save-dev 或在package.json中配置以下依赖，执行 npm install 安装 "devDep...
eslint-config-trybe:使用的ESLint共享配置程序包为Trybe
03-13
基础，前端和后端模块中的项目所使用的ESLint共享配置 安装 所有三个软件包的说明都应该相同，唯一的区别是软件包名称。 这些是每个模块的软件包名称： 基础知识： eslint-config-trybe-fundamentals 前端： ...
Eslint 的使用
Start的小笔记
02-16 2160
安装 // vsCode 安装eslint扩展 // 全局安装 npm i -g eslint babel-eslint //项目安装eslint依赖项 yarn add eslint babel-eslint eslint-plugin-vue -D //安装npx npm install -g npx //在项目里同过npx 初始化eslint配置【按选项配置】 npx eslint --init ESLint vs code 配置 打开插件 =====》点击扩展设置 添加配置 每次在保存
项目中完整的使用eslint检查代码风格过程
最新发布
花落微凉梦清幽的博客
04-02 489
如何在创建项目后使用eslint，比如vue项目，uniapp项目，ESLint：用来规范或者约束代码，例如引号用单引号还是双引号 ，代码结尾是否要加分号，定义变量是否被调用了等等。2.自行建立项目，如用vue-cli快速建立vue项目，用hbuildX建立uniapp项目，详细步骤自行在网上搜索。也可以执行eslint index.js去运行该文件，进行eslint检查，发现有一处错误，一处警告。也可以执行eslint index.js --fix进行代码修复，自动会补充分号，改成双引号。
eslint的使用
马优晨
07-11 1817
ESlint 被设计为完全可配置的，这意味着你可以关闭每一个规则而只运行基本语法验证，或混合和匹配 ESLint 默认绑定的规则和你的自定义规则，以让 ESLint 更适合你的项目。有两种主要的方式来配置 ESLint： 1- 安装eslint npm i -g eslint 如果使用脚手架工具vue-cli 或者 dev-cli搭建的项目会自动生成配置eslint的文件，名字叫做.es...
eslint 的使用
Gytha_1的博客
04-08 330
ESLint的用途 审查代码是否符合编码规范和统一的代码风格 审查代码是否存在语法错误 官网 https://eslint.org/ 居然找到了一个中文网站： http://eslint.cn/docs/user-guide/configuring#configuration-file-formats 开始使用 npm install eslint --save-de https://esl...
ESLint的使用
duansamve的博客
02-05 1372
1、安装eslint： cnpm i eslint -D 2、vscode中使用ctrl+shift+p快捷键安装eslint配置文件或手动新建一个配置文件.eslintrc.js，或者使用如下的命令行来自动生成： eslint --init .eslintrc 文件内容大体如下： { "env": { "es6": true, "node...
如何使用ESlint
weixin_30405421的博客
03-21 148
参考链接：https://github.com/eslint/eslint 一、ESLint跟JSLint和JSHint类似，但有以下区别： 1.使用Espree进行js解析(parse) 2.用AST抽象语法树去识别(evaluate)代码中的模式 3.每个规则都是独立的插件 二、安装 全局安装： npm install -g eslint 三、使用 如果是第一次使用，esli...
eslint的用法
qq_38270351的博客
05-11 2152
eslint介绍及用法 eslint是一个插件化的代码检测工具，可以用于检查常见的代码错误，也可以进行代码风格上的检查，控制代码的质量，提高代码的可读性。在团队协作中，统一的代码风格更具可读性、可维护性。 js Lint工具的介绍：JSLint，JSHint，JSCS和ESLint是四种流行的方案，下面对四种工具做下简单的对比： - JSLint ：出现的最早，即装即用，不可配置和扩展，没有...
浅谈开发eslint规则
01-19
开发 eslint 规则 前端的日常开发离不开各种 lint 的支持，使用 lint 的一种误解是：个人能力不足，必须 lint 规范才能写出规范的代码，实际上规范的定义主要取决... 在原有的 eslint 的基础上配置些 config（具体规则
eslint-format：使用ESLint格式化代码
03-04
安装apm install eslint-format eslint-format将查找项目本地的eslint版本，并在可用的情况下使用它。 如果未找到，它将退回到其附带的版本。 可以说，您依赖于eslint的特定版本，也许它具有未发布的功能，也许它比...
在React项目中使用Eslint代码检查工具及常见问题
12-09
背景 最近使用 create-react-app 创建了一个项目。但是众所周知的是，这个脚手架创建的项目...安装完成之后，我们先创建基础的 .eslintrc.yml （建议使用 .yml 格式，json/js 格式也可以）： ./node_modules/.bin/esl
vim-eslint：ESLint的Vim插件
02-04
vim-eslint：ESLint的Vim插件
Eslint的使用
你的博客
11-04 5323
1、Eslint的作用SLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具，它的目标是保证代码的一致性和避免错误。在许多方面，它和 JSLint、JSHint 相似，除了少数的例外： - ESLint 使用 Espree 解析 JavaScript。 - ESLint 使用 AST 去分析代码中的模式 - ESLint 是完全插件化的。每一个规则都是一个
关于如何使用esLint
阿洪的博客
06-24 353
关于如何使用esLint eslint是一个对代码进行静态检查，对代码的规范有显著帮助。 如何使用： 首先全局下载 npm install -g eslint // 之后就可以使用了 eslint --init // 进行初始化后，会有许多选择，按自己的配置点确定就好 // 之后会生成一个 .eslintrc.js的文件可以在里面配置一些东西 // 例如在rules下 "rules": {...
eslint配置与使用
欢迎大家一起攻克bug
06-19 4414
ESLint 是一个 JavaScript 代码检查工具，它可以用于检查代码的风格和潜在错误，并提供规范化和代码质量控制。
eslint用法
yinge0508的博客
07-13 338
ESLint 使用方法 一、全局安装 npm install -g eslint 二、生成配置文件 　　在项目根目录执行init，生成.eslintrc文件。在init时，要求根目录存在package.json。当然也可以直接复制个现成的.eslintrc.js文件。 eslint --init 三、自定义配置项 　　根据规则文档，编辑.eslintrc.js文件内容。 1 2 3 4 5 6 7 8 9
ESLint入门 安装 使用 详解
热门推荐
lwx931449660的博客
04-15 1万+
首先，ESLint是什么东西呐，看官网的介绍： ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具，它的目标是保证代码的一致性和避免错误。在许多方面，它和 JSLint、JSHint 相似。 ESLint 是完全插件化的。每一个规则都是一个插件并且你可以在运行时添加更多的规则。 通俗点讲就是ESLint其实就是一个代码格式化检测工具，它规定你.........
vue3+ts使用eslint
07-28
在使用Vue3+TypeScript时，可以使用ESLint来进行代码规范和错误检查。首先，你可以使用Vite脚手架创建一个Vue3+TypeScript项目，并进行ESLint的配置。你可以使用Standard规范作为基础配置，并且可以将其应用到你的个人项目中。\[1\] 在配置ESLint时，你需要创建一个.eslintrc.cjs文件，并在其中进行配置。你可以使用以下配置作为参考：\[2\] ```javascript module.exports = { env: { browser: true, es2021: true, node: true, }, extends: \[ 'eslint:recommended', 'plugin:vue/vue3-recommended', 'plugin:prettier/recommended', 'eslint-config-prettier', \], parser: 'vue-eslint-parser', parserOptions: { ecmaVersion: 'latest', sourceType: 'module', parser: '@typescript-eslint/parser', ecmaFeatures: { modules: true, jsx: true, }, }, plugins: \['vue', 'prettier', '@typescript-eslint'\], globals: {}, rules: {}, } ``` 如果你想根据Vue3官方文档中提到的eslint-plugin-vue的指引进行配置，你可以在.eslintrc.cjs文件中添加一些配置项。例如：\[3\] ```javascript module.exports = { // ... parser: 'vue-eslint-parser', parserOptions: { parser: '@typescript-eslint/parser', // ... }, // ... } ``` 这样，你就可以在Vue3+TypeScript项目中使用ESLint进行代码规范和错误检查了。 #### 引用[.reference_title] - *1* *3* [Vite 创建 Vue3+TS 项目配置 ESLint](https://blog.csdn.net/qq_41581588/article/details/130052727)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [vite + vue3 + ts + esLint + prettier 配置](https://blog.csdn.net/weixin_44440116/article/details/129837795)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值