详解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 相关文章推荐
Maps Javascript
Jan 22 Javascript
浅说js变量
May 25 Javascript
Jquery中删除元素的实现代码
Dec 29 Javascript
javascript面向对象入门基础详细介绍
Sep 05 Javascript
jQuery.validate 常用方法及需要注意的问题
Mar 20 Javascript
jquery根据name属性查找的小例子
Nov 21 Javascript
Jquery Ajax解析XML数据(同步及异步调用)简单实例
Feb 12 Javascript
Node.js调用fs.renameSync报错(Error: EXDEV, cross-device link not permitted)
Dec 27 Javascript
JavaScript实现计算多边形质心的方法示例
Jan 31 Javascript
Vue如何使用混合Mixins和插件开发详解
Feb 05 Javascript
jQuery实时统计输入框字数及限制
Jun 24 jQuery
浅谈Ant Design Pro 菜单自定义 icon
Nov 17 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开发入门教程之面向对象
2006/12/05 PHP
某大型网络公司应聘时的笔试题目附答案
2008/03/27 PHP
PHP 魔术函数使用说明
2010/05/14 PHP
PHP学习笔记之一
2011/01/17 PHP
php判断变量类型常用方法
2012/04/24 PHP
php几个预定义变量$_SERVER用法小结
2014/11/07 PHP
PHP合并数组的2种方法小结
2016/11/24 PHP
使用vs code编辑调试php配置的方法
2019/01/29 PHP
禁止刷新,回退的JS
2006/11/25 Javascript
可以将word转成html的js代码
2010/04/11 Javascript
js中查找最近的共有祖先元素的实现代码
2010/12/30 Javascript
javascript学习笔记(十) js对象 继承
2012/06/19 Javascript
加载远程图片时,经常因为缓存而得不到更新的解决方法(分享)
2013/06/26 Javascript
javascript实现五星评价代码(源码下载)
2015/08/11 Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
2016/09/16 Javascript
微信小程序 条件渲染详解
2016/10/09 Javascript
微信小程序 http请求详细介绍
2016/10/09 Javascript
vue 打包后的文件部署到express服务器上的方法
2017/08/09 Javascript
Vue利用Blob下载原生二进制数组文件
2019/09/25 Javascript
vue项目中定义全局变量、函数的几种方法
2019/11/08 Javascript
python中zip()方法应用实例分析
2016/04/16 Python
Python爬虫实例_城市公交网络站点数据的爬取方法
2018/01/10 Python
python3 tkinter实现点击一个按钮跳出另一个窗口的方法
2019/06/13 Python
浅析PyTorch中nn.Module的使用
2019/08/18 Python
Python用K-means聚类算法进行客户分群的实现
2020/08/23 Python
HTML5中的Web Notification桌面右下角通知功能的实现
2018/04/19 HTML / CSS
马来西亚最热门的在线时尚商店:FashionValet
2018/11/11 全球购物
Yummie官方网站:塑身衣和衣柜必需品
2019/10/29 全球购物
毕业生求职自荐信怎么写
2014/01/08 职场文书
2014年学习雷锋活动总结
2014/03/01 职场文书
工作失误检讨书范文
2015/01/26 职场文书
2015年平安创建工作总结
2015/04/29 职场文书
学法用法心得体会(2016推荐篇)
2016/01/21 职场文书
原来闭幕词是这样写的呀!
2019/07/01 职场文书
2019年公司快递收发管理制度模板
2019/11/20 职场文书
SONY600GR,国产收音机厂商永远的痛
2022/04/05 无线电