版权声明:此文首发于我的个人站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')
}
},
......