vue项目中vscode格式化配置和eslint配置冲突
问题描述
- 使用vscode开发vue项目的时候,从远端拉下一个新的项目后,安装完依赖后跑起项目时,发现直接报了一堆语法错误:包括换行、空格、单双引号、分号等各种格式问题
- 因为我的 vscode 安装使用 vetur 插件,它默认使用的是 prettier 来格式化代码,从而在拉下代码时,直接格式化了我的代码
分析
- 这时首先想到的处理办法,是把 webpack 中 eslint 的相关配置关闭,这时,随然报错不见了,但问题并没有解决
- 这个项目是多人开发,如果我不设置 eslint 检测,那么对其它人来说结果将是灾难性的
- 所以只好进行vscode局部配置的修正,并重新拉下来代码,配置如下
{
"vetur.format.defaultFormatterOptions": {
"prettier": {
"singleQuote": true,
"semi": false
}
}
}
- 然而,这并没有撤底解决问题。因为我的 vscode 全局配置中,仍然有大量的配置设置,很有可能存在我没有发现的意外问题(地雷)
解决
- 所以还是要正面解决这个问题。我的方案是将 vscode 配置文件进行同步,保证所有人的编辑器配置是一致的
- 但是这需要一个前提,就是每一个开发者,都要保证自已的 vscode 中的合局配置必须是空的,是干净的
- 所以,这也提醒我们,无论是在开发代码时,还是配置环境时,可以局部配置的一定要走局部,不要去污然全局
- 另外,最好将 vscode 的插件配置信息也同步到项目中,这样就可以保证所有人的代码都可以正常的流转,不必担心引发格式上的意外
.gitignore文件配置【不忽略上传】vscode配置
- 默认情况下.vscode配置文件夹是不会加入git监控的
- gitignore配置参考
#设置同步 vscode配置
!/.vscode/settings.json
vue项目中vscode格式化配置和eslint配置冲突的更多相关文章
- vscode 格式化代码 与 eslint 有冲突的问题解决
项目中配置了eslint后,在使用vue界面里格式化的时候总是不一致.然后在配置中加了配置也无效(File - Preference - Setting) 查了下原因是在vue开发的时候我们一般都安装 ...
- vue项目中兼容ie8以上浏览器的配置
1.首先需要在根目录的index.html文件加入如下代码 <meta http-equiv="X-UA-Compatible" content="IE=edge& ...
- 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap
1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...
- 如何在VUE项目中添加ESLint
如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...
- 在vue项目中如何添加eslint
随着vue的越做越好,更多的开发者选择使用vue,本篇记录如何在vue项目中添加eslint. 首先第一种就是在vue项目创建初始时就选择了创建,随着初始化一起代入到了项目当中,那么要是一开始觉得es ...
- 如何在Vue项目中,通过点击DOM自动定位VScode中的代码行?
作者:vivo 互联网大前端团队- Youchen 一.背景 现在大型的 Vue项目基本上都是多人协作开发,并且随着版本的迭代,Vue 项目中的组件数也会越来越多,如果此时让你负责不熟悉的页面功能开发 ...
- vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em,rem的区别
移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...
- 在vue项目中的axios使用配置记录
默认vue项目中已经安装axios,基于element-ui开发,主要记录配置的相关. axiosConfig.js import Vue from 'vue' import axios from ' ...
- vue 项目中实用的小技巧
# 在Vue 项目中引入Bootstrap 有时在vue项目中会根据需求引入Bootstrap,而Bootstrap又是依赖于jQuery的,在使用npm按照时,可能会出现一系列的错误 1.安装jQu ...
随机推荐
- oracle 分析函数和开窗函数
最近遇到一个需求,将查询出的数据按照地区分组,随机取出每个区域的2条数据,这里用到了oracle的分析和开窗函数: 最终写出的sql如下: select * from (select region,r ...
- [Swift]LeetCode249.群组偏移字符串 $ Group Shifted Strings
Given a string, we can "shift" each of its letter to its successive letter, for example: & ...
- ActiveMQ嵌入Tomcat
在一些项目中,单独开启一个ActiveMQ,对于项目实施来说有时略显繁琐.所以我们将ActiveMQ内嵌到Tomcat,Tomcat启动同时就顺带启动了ActiveMQ.由此我们需要掌握三个个重要的知 ...
- python高级-动态特性(20)
一.动态语⾔的定义 动态语言是在运行时确定数据类型的语言.变量使用之前不需要类型声明,通常变量的类型是被赋值的那个值的类型.现在比较热门的动态语言有:Python.PHP.JavaScript.Obj ...
- 第一次c语言上机
实验结论 part1: 第一部分的内容是按照书上所给的例题,进行简单的验证.虽然听起来很简单,但是由于之前并未接触过这方面的内容,还是犯了很多微小的错误.主要是在进行编程语言的输入时会输错字母,会忘记 ...
- 由浅入深的讲述Get和Post的区别
对于网上对get和post区别的长篇大论,我只想说一些干货其中最重要的是:GET和POST本质上两者没有任何区别.他们都是HTTP协议中的请求方法.底层实现都是基于TCP/IP协议.所谓区别,只是浏览 ...
- [Abp 源码分析]五、系统设置
0.简要介绍 Abp 本身有两种设置,一种就是 上一篇文章 所介绍的模块配置 Configuration,该配置主要用于一些复杂的数据类型设置,不仅仅是字符串,也有可能是一些 C# 运行时的一些变量. ...
- Hive篇--相关概念和使用二
一.基本概念 Hive分桶: 1.概念 分桶表是对列值取哈希值的方式,将不同数据放到不同文件中存储.对于hive中每一个表.分区都可以进一步进行分桶.(可以对列,也可以对表进行分桶)由列的哈希值除以桶 ...
- Python内置函数(44)——next
英文文档: next(iterator[, default]) Retrieve the next item from the iterator by calling its __next__() m ...
- Chorme浏览器渲染MathJax时出现竖线的解决方法
Chorme浏览器渲染MathJax时出现竖线的原因分析与解决方法 查资料知,Chorme中显示MathJax时出现竖线的原因如下: 新版的Chorme浏览器在解析css时,会对其中的值进行向上取整( ...