详解Vue取消eslint语法限制


Posted in Javascript onAugust 04, 2018

由于vue对语法的限制过于严格,以至于在我第一次编译运行的时候一直编译失败,当然也包括一些警告:

➜ my-project npm run dev 
 
> bblee-app@1.0.0 dev /Users/bianlifeng/my-project
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
 
 95% emitting                                      
 
 WARNING Compiled with 1 warnings                                                               5:00:12 PM
 
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 0 spaces but found 2  
 src/components/Message.vue:46:1
  export default {
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 2 spaces but found 4  
 src/components/Message.vue:47:1
   data() {
  ^
 
 ✘ http://eslint.org/docs/rules/space-before-function-paren Missing space before function parentheses   
 src/components/Message.vue:47:9
   data() {
      ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 4 spaces but found 6  
 src/components/Message.vue:48:1
    return {
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 6 spaces but found 8  
 src/components/Message.vue:49:1
     form: {
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 
 src/components/Message.vue:50:1
      name: '',
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 
 src/components/Message.vue:51:1
      region: '',
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 
 src/components/Message.vue:52:1
      date1: '',
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 
 src/components/Message.vue:53:1
      date2: '',
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 
 src/components/Message.vue:54:1
      delivery: false,
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 
 src/components/Message.vue:55:1
      type: [],
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 
 src/components/Message.vue:56:1
      resource: '',
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 
 src/components/Message.vue:57:1
      desc: ''
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 6 spaces but found 8  
 src/components/Message.vue:58:1
     }
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 4 spaces but found 6  
 src/components/Message.vue:59:1
    }
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 2 spaces but found 4  
 src/components/Message.vue:60:1
   },
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 2 spaces but found 4  
 src/components/Message.vue:61:1
   methods: {
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 4 spaces but found 6  
 src/components/Message.vue:62:1
    onSubmit() {
  ^
 
 ✘ http://eslint.org/docs/rules/space-before-function-paren Missing space before function parentheses   
 src/components/Message.vue:62:15
    onSubmit() {
         ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 6 spaces but found 8  
 src/components/Message.vue:63:1
     console.log('submit!');
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 4 spaces but found 6  
 src/components/Message.vue:64:1
    }
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 2 spaces but found 4  
 src/components/Message.vue:65:1
   }
  ^
 
 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 0 spaces but found 2  
 src/components/Message.vue:66:1
  }
  ^
 
 
✘ 23 problems (23 errors, 0 warnings)
 
 
Errors:
 21 http://eslint.org/docs/rules/indent
  2 http://eslint.org/docs/rules/space-before-function-paren
 
You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.

当然,这里的警告我是知道怎么回事,但是这个错误我就很不明白了,原来eslint是一个语法检查工具,但是限制很严格,在我的vue文件里面很多空格都会导致红线(红线可以关闭提示),虽然可以关闭,但是在编译的时候老是会跳出来,所以能关闭是最好的了。

关闭方法:

在build/webpack.base.conf.js文件中,注释或者删除掉:module->rules中有关eslint的规则

module: {
 rules: [
  //...(config.dev.useEslint ? [createLintingRule()] : []), // 注释或者删除
  {
   test: /\.vue$/,
   loader: 'vue-loader',
   options: vueLoaderConfig
  },
  ...
  }
 ]
}

然后重新运行一下npm run dev或者构建命令 npm run build就可以啦。

Javascript 相关文章推荐
用cssText批量修改样式
Aug 29 Javascript
js跟随滚动条滚动浮动代码
Dec 31 Javascript
你必须知道的Javascript知识点之"单线程事件驱动"的使用
Apr 23 Javascript
jQuery中filter()和find()的区别深入了解
Sep 25 Javascript
PhotoShop给图片自动添加边框及EXIF信息的JS脚本
Feb 15 Javascript
PHP+jQuery+Ajax+Mysql如何实现发表心情功能
Aug 06 Javascript
jquery判断input值不为空的方法
Jun 05 Javascript
jQuery插件FusionCharts实现的2D面积图效果示例【附demo源码下载】
Mar 06 Javascript
vue.js 实现图片本地预览 裁剪 压缩 上传功能
Mar 01 Javascript
js正则表达式校验指定字符串的方法
Jul 23 Javascript
jquery弹窗时禁止body滚动条滚动的例子
Sep 21 jQuery
JavaScript实现鼠标经过表格某行时此行变色
Nov 20 Javascript
JavaScript原型对象、构造函数和实例对象功能与用法详解
Aug 04 #Javascript
JavaScript中变量、指针和引用功能与操作示例
Aug 04 #Javascript
webpack4.x开发环境配置详解
Aug 04 #Javascript
微信小程序实现收藏与取消收藏切换图片功能
Aug 03 #Javascript
解决mpvue + vuex 开发微信小程序vuex辅助函数mapState、mapGetters不可用问题
Aug 03 #Javascript
mpvue跳转页面及注意事项
Aug 03 #Javascript
JavaScript高级函数应用之分时函数实例分析
Aug 03 #Javascript
You might like
php中使用explode查找某个字符是否存在的方法
2011/07/12 PHP
PHP 输出缓冲控制(Output Control)详解
2016/08/25 PHP
Laravel Validator自定义错误返回提示消息并在前端展示
2019/05/09 PHP
Javascript实现的分页函数
2006/12/22 Javascript
js中array的sort()方法使用介绍
2014/02/20 Javascript
js实现背景图片感应鼠标变化的方法
2015/02/28 Javascript
javascript实现全角转半角的方法
2016/01/23 Javascript
基于jquery编写的放大镜插件
2016/03/23 Javascript
全面解析JavaScript中的valueOf与toString方法(推荐)
2016/06/14 Javascript
在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法
2016/08/05 Javascript
数组Array的排序sort方法
2017/02/17 Javascript
react系列从零开始_简单谈谈react
2017/07/06 Javascript
Vue.js进行查询操作的实例详解
2017/08/25 Javascript
vue的mixins属性详解
2018/03/14 Javascript
JS获取浏览器地址栏的多个参数值的任意值实例代码
2018/07/24 Javascript
Node.js对MongoDB进行增删改查操作的实例代码
2019/04/18 Javascript
vue项目中将element-ui table表格写成组件的实现代码
2019/06/12 Javascript
利用JS代码自动删除稿件的普通弹幕功能
2019/09/20 Javascript
如何将python中的List转化成dictionary
2016/08/15 Python
基于Linux系统中python matplotlib画图的中文显示问题的解决方法
2017/06/15 Python
Python数据结构与算法之字典树实现方法示例
2017/12/13 Python
Python中pandas模块DataFrame创建方法示例
2018/06/20 Python
python for循环输入一个矩阵的实例
2018/11/14 Python
对python中数据集划分函数StratifiedShuffleSplit的使用详解
2018/12/11 Python
使用Python完成15位18位身份证的互转功能
2019/11/06 Python
500行python代码实现飞机大战
2020/04/24 Python
python3中确保枚举值代码分析
2020/12/02 Python
String、StringBuffer、StringBuilder有区别
2015/09/18 面试题
运动会通讯稿200字
2014/02/16 职场文书
安全生产大检查方案
2014/05/07 职场文书
尊老爱亲美德少年事迹材料
2014/08/14 职场文书
婚礼父母致辞
2015/07/28 职场文书
CSS3点击按钮圆形进度打钩效果的实现代码
2021/03/30 HTML / CSS
中国古风插画师排行榜:夏达第一,第三是阴阳师姑获鸟皮肤创作者
2022/03/18 国漫
游戏《我的世界》澄清Xbox版暂无计划加入光追
2022/04/03 其他游戏
Win11无法访问设备和打印机 如何解决页面空白
2022/04/09 数码科技