Vue2踩坑记-Eslint

廖鸿达
2023-12-01

版权声明:此文首发于我的个人站Vue2踩坑记-Eslint,转载请注明出处。

写Vue2的模块化的时候,代码格式稍微不规范,比如:多打了一个空格、没有正确缩进等等,都会报错,报错的意思 就是说 ‘空格多了’、‘缩进不正确’布拉布拉….

还以为vue2和Jade一样对代码的缩进要求很高呢,然后查了一下才回想起来
安装Vue2的时候,默认安装了Eslint的工具,就是 Eslint搞的鬼..

ESLint是一个QA工具,用来避免低级错误和统一代码的风格

Vue2的根目录里有个 .editorconfig的文件
配制如下:

root = true

[*]
charset = utf-8     // 编码格式
indent_style = space    // 缩进样式
indent_size = 2     // 缩进n个空格
end_of_line = lf
insert_final_newline = true     // 最后插入换行符
trim_trailing_whitespace = true     // 修剪最后的空白

开发中,唯一可能修改的是 缩进的空格数量,把2改成4 就行了,按一下Tab键就可以缩进4个空格的距离。
这让我想起来,之前的angular2中,我新进的项目也有Eslint的配制,死活改不了缩进长度,还以为Webstorm抽风了…..

如果不想使用Eslint,可以直接在Vue2根目录中找build/webpack.base.conf.js,在此配制中找到包含eslint-loader的部分(如下)删除之,再重启即可。

......
module: {
    rules: [
      {
        test: /\.(js|vue)$/,
        loader: 'eslint-loader',
        enforce: 'pre',
        include: [resolve('src'), resolve('test')],
        options: {
          formatter: require('eslint-friendly-formatter')
        }
      },
      ......
 类似资料: