vue-cli关闭/禁用/使用ESLint语法检测功能
在使用vue-cli命令‘vue init webpack 项目名称’创建项目的过程中,如果无意选择了ESLint语法检测,会在项目目录中出现如下的ESLint配置文件。
文章图片
ESLint配置文件 如何禁用ESLint:
在项目的本目录下面config—index.js 文件夹中配置一下就可以禁用useEslint设为false。
文章图片
禁用ESLint 如何去除ESLint:
如果我们根本不想要ESLInt,并且不想新建项目。我们要知道vue脚手架运行依赖于webpack,所以我们要从webpack配置入手。
不但要把config—index.js 文件夹中配置禁用useEslint设为false,而且在配置文件中,找到如图配置
文章图片
相关参数配置 第一步:如上图所示,我们全局查找config.dev.useEslint(第一步设置的true或者false)字段,以及他的相关方法的位置(根目录—build—webpack.base.config.js)删除createLintingRule()方法和‘...(config.dev.useEslint ? [createLintingRule()] : []),’。
第二步:删除文件
文章图片
ESLint配置文件 如何使用ESLint:
正常情况下,使用了ESLint以后,在控制台npm run dev的时候会报一些代码提示信息,如下,在路由配置中routers数组的最后多了一个逗号:
文章图片
路由配置 虽然页面可以正常运行,但是在控制台会打印一条提示:
文章图片
提示信息 如果不删除ESLint而且还不想检测可以使用一些方法来避免部分代码块的检测提示。
整个文件范围内禁止规则出现警告
将/* eslint-disable */放置于文件最顶部
/* eslint-disable */alert('foo');
文章图片
整个文件都不会提示
在文件中临时禁止规则出现警告
将需要忽略的代码块用注释包裹起来
/* eslint-disable */alert('foo'); /* eslint-enable */
对指定规则的启用或者禁用警告
将需要忽略的代码块用注释包裹起来
/* eslint-disable no-alert, no-console */alert('foo');
console.log('bar'); /* eslint-enable no-alert, no-console */
对指定行禁用规则警告
有两种形式
alert('foo'); // eslint-disable-line// eslint-disable-next-linealert('foo');
在指定行上禁用指定的某个规则
alert('foo'); // eslint-disable-line no-alert// eslint-disable-next-line no-alertalert('foo');
在某个特定的行上禁用多个规则【vue-cli关闭/禁用/使用ESLint语法检测功能】如果想要充分的了解ESLint的代码检测并合理使用它,就去官网看一看吧。ESLint官网
alert('foo'); // eslint-disable-line no-alert, quotes, semi// eslint-disable-next-line no-alert, quotes, semialert('foo');
推荐阅读
- vue-cli|vue-cli 3.x vue.config.js 配置
- 如何在手机上查看测试vue-cli构建的项目
- Linux|Linux 服务器nginx相关命令
- vue-cli2和vue-cli3的区别
- vue使用vue-cli新建项目
- 使用vue-cli3.0写一个todoList
- 三行代码禁用侧滑返回
- vue-cli3.0使用proxytable解决跨域问题
- 基于vue-cli2.0,webpack3升级为webpack4的踩坑之旅以及优化
- Vue-cli|Vue-cli 原理分析