vue项目中vscode格式化配置和eslint配置冲突

更新日期: 2019-02-26阅读: 4.1k标签: 插件

问题描述

使用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

链接: https://fly63.com/article/detial/2122

对于前端开发,整理推荐好用的chrome插件或应用

向web前端开发者整理提供的chrome插件或应用:比如Postman、JSON Viewer、Page Ruler 、ChromeADB 等等

使用原生js开发插件的实现方法

作为前端开发,我们都习惯使用一些开源的插件例如jquery工具库,那么如何使用原生js来开发封装一个自己的插件呢?接下来就看一下怎么去开发一个自己的js插件,先上代码

typeahead.js_jquery input 搜索自动补全jQuery插件

jquery.typeahead.js是一款高级的自动补全jQuery插件。该自动补全插件提供超过50个配置选项和回调方法,用于完成自动补全功能,能够完成绝大部分表单自动补全的需求。

js轮播插件_轮播图js代码插件总汇

这篇文章为大家分享图片轮播插件,最全最简单最通用的 幻灯片轮播插件,pc端和移动端都可完美使用,能满足绝大部分网站的轮播需求。js轮播插件包括Swiper、slick、owl carousel2、jssor/slider 、iSlider 等

ios风格的时间选择插件

在上个项目中,客户希望时间选择插件可以是ios风格的那种,但是找了很久,发现并没有用vue的ios风格时间插件,于是自己便自己造了一个轮子.插件依赖于better-scroll和vue

前端最常用的vscode插件集

在前端开发中,使用Visual Studio Code有哪些你常用的插件?推荐几个自己喜欢的,不带链接,自己搜索安装吧。这些都是比较实用、前端必备的插件集

浏览器插件_常用谷歌浏览器插件推荐

常用谷谷歌浏览器确实没有其它国产软件的内置功能丰富。但是 Google 浏览器的的优点恰恰就体现在拥有超简约的界面,以及支持众多强大好用的扩展程序,用户能够按照自己的喜好去个性化定制浏览器。今天我就给大家介绍几款自己常用的插件。

sublime安装插件

安装Sublime text 2插件很方便,可以直接下载安装包解压缩到Packages目录,也可以安装package control组件,然后直接在线安装

BlockUI详细用法_Jquery中ajax加载提示插件blickUI

BlockUI 插件是用于进行AJAX操作时模拟同步传输时锁定浏览器操作。当它被激活时,它会阻止使用者与页面(或页面的一部分)进行交互,直至它被取消。BlockUI以在DOM中添加元素的方法来实现阻止用户与浏览器交互的外观和行为

Vue实现一个图片懒加载插件

图片懒加载是一个很常用的功能,特别是一些电商平台,这对性能优化至关重要。今天就用vue来实现一个图片懒加载的插件。 这篇博客采用“三步走”战略——Vue.use()、Vue.direction、Vue图片懒加载插件实现,逐步实现一个Vue的图片懒加载插件。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!