问题描述

  • 使用vscode开发vue项目的时候,从远端拉下一个新的项目后,安装完依赖后跑起项目时,发现直接报了一堆语法错误:包括换行、空格、单双引号、分号等各种格式问题
  • 因为我的 vscode 安装使用 vetur 插件,它默认使用的是 prettier 来格式化代码,从而在拉下代码时,直接格式化了我的代码

分析

  • 这时首先想到的处理办法,是把 webpack 中 eslint 的相关配置关闭,这时,随然报错不见了,但问题并没有解决
  • 这个项目是多人开发,如果我不设置 eslint 检测,那么对其它人来说结果将是灾难性的
  • 所以只好进行vscode局部配置的修正,并重新拉下来代码,配置如下
{
"vetur.format.defaultFormatterOptions": {
"prettier": {
"singleQuote": true,
"semi": false
}
}
}
  • 然而,这并没有撤底解决问题。因为我的 vscode 全局配置中,仍然有大量的配置设置,很有可能存在我没有发现的意外问题(地雷)

解决

  • 所以还是要正面解决这个问题。我的方案是将 vscode 配置文件进行同步,保证所有人的编辑器配置是一致的
  • 但是这需要一个前提,就是每一个开发者,都要保证自已的 vscode 中的合局配置必须是空的,是干净的
  • 所以,这也提醒我们,无论是在开发代码时,还是配置环境时,可以局部配置的一定要走局部,不要去污然全局
  • 另外,最好将 vscode 的插件配置信息也同步到项目中,这样就可以保证所有人的代码都可以正常的流转,不必担心引发格式上的意外

.gitignore文件配置【不忽略上传】vscode配置

#设置同步 vscode配置
!/.vscode/settings.json

vue项目中vscode格式化配置和eslint配置冲突的更多相关文章

  1. vscode 格式化代码 与 eslint 有冲突的问题解决

    项目中配置了eslint后,在使用vue界面里格式化的时候总是不一致.然后在配置中加了配置也无效(File - Preference - Setting) 查了下原因是在vue开发的时候我们一般都安装 ...

  2. vue项目中兼容ie8以上浏览器的配置

    1.首先需要在根目录的index.html文件加入如下代码 <meta http-equiv="X-UA-Compatible" content="IE=edge& ...

  3. 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap

    1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...

  4. 如何在VUE项目中添加ESLint

    如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...

  5. 在vue项目中如何添加eslint

    随着vue的越做越好,更多的开发者选择使用vue,本篇记录如何在vue项目中添加eslint. 首先第一种就是在vue项目创建初始时就选择了创建,随着初始化一起代入到了项目当中,那么要是一开始觉得es ...

  6. 如何在Vue项目中,通过点击DOM自动定位VScode中的代码行?

    作者:vivo 互联网大前端团队- Youchen 一.背景 现在大型的 Vue项目基本上都是多人协作开发,并且随着版本的迭代,Vue 项目中的组件数也会越来越多,如果此时让你负责不熟悉的页面功能开发 ...

  7. vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em,rem的区别

    移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...

  8. 在vue项目中的axios使用配置记录

    默认vue项目中已经安装axios,基于element-ui开发,主要记录配置的相关. axiosConfig.js import Vue from 'vue' import axios from ' ...

  9. vue 项目中实用的小技巧

    # 在Vue 项目中引入Bootstrap 有时在vue项目中会根据需求引入Bootstrap,而Bootstrap又是依赖于jQuery的,在使用npm按照时,可能会出现一系列的错误 1.安装jQu ...

随机推荐

  1. Dubbo 分布式事务一致性实现

    我觉得事务的管理不应该属于Dubbo框架, Dubbo只需实现可被事务管理即可, 像JDBC和JMS都是可被事务管理的分布式资源, Dubbo只要实现相同的可被事务管理的行为,比如可以回滚, 其它事务 ...

  2. java web项目get,post请求参数中文乱码解决

    [转载]原文地址:https://www.cnblogs.com/tom-plus/p/6392279.html 在开发过程中,有时候会碰到get,post请求参数中文乱码. 原因: Http请求传输 ...

  3. [Swift]LeetCode232. 用栈实现队列 | Implement Queue using Stacks

    Implement the following operations of a queue using stacks. push(x) -- Push element x to the back of ...

  4. [Swift]LeetCode956. 最高的广告牌 | Tallest Billboard

    You are installing a billboard and want it to have the largest height.  The billboard will have two ...

  5. 使用jQuery获取元素的宽度或高度的几种情况

    今天说说使用jQuery获取元素大小的遇到几种情况 使用jQuery获取元素的宽度或高度的有几种情况: 1.使用width(),它只能获取当前元素的内容的宽度: 2.使用innerWidth(),它只 ...

  6. Python内置函数(49)——pow

    英文文档: pow(x, y[, z]) Return x to the power y; if z is present, return x to the power y, modulo z (co ...

  7. Python内置函数(24)——frozenset

    英文文档: class frozenset([iterable]) Return a new frozenset object, optionally with elements taken from ...

  8. xtrabackup备份

    增量备份: xtrabackup --backup --target-dir=/data/backup/base --datadir=/var/lib/mysql xtrabackup --backu ...

  9. InstallShield Limited Edition使用说明

    从Visual Studio 2012开始,微软就把自家原来的安装与部署工具彻底废掉了,转而让大家去安装使用第三方的打包工具“InstallShield Limited Edition for Vis ...

  10. 大数据技术之_19_Spark学习_01_Spark 基础解析 + Spark 概述 + Spark 集群安装 + 执行 Spark 程序

    第1章 Spark 概述1.1 什么是 Spark1.2 Spark 特点1.3 Spark 的用户和用途第2章 Spark 集群安装2.1 集群角色2.2 机器准备2.3 下载 Spark 安装包2 ...