First of all, install Prettier extension: "Pettier - Code formatter".

The open the VSCode setting:

cmd + ,

Search for "format": and enable "Format On Save"

Add .prettierrc file:

{
"tabWidth": ,
"semi": true,
"singleQuote": true
}

Add .prettierignore file:

dist
package-lock.json

Also you might want to make sure Prettier use eslint rules as well, not just ingore eslint rules we already setup:

install:

npm install --save-dev eslint-config-prettier
// .eslintrc

{
"extends": ["eslint:recommended", "prettier"]
}

Add both file into global gitignore:

touch ~/.gitignore_global // create one if you don't have it

vim ~/.gitignore_global // edit it

//add
.prettierrc
.prettierignore // Run
git config --global core.excludesfile ~/.gitignore_global

[Tool] Enable Prettier in VSCode as Format on Save and add config files to gitingore的更多相关文章

  1. vs code的使用(一) Format On Paste/Format On Save/ Format On Type

    很多经典的问题可以搜索出来,但是一些很小的问题网上却没有答案 (这是最令人发狂的,这么简单,网上居然连个相关的信息都没有给出) (就比如我想保存后自动格式化,但网上的大部分都是如何取消保存后自动格式化 ...

  2. eslint+prettier 的 VSCode配置项

    { "files.autoSave": "off", "editor.fontSize": 12, "terminal.integ ...

  3. Using Tensorflow SavedModel Format to Save and Do Predictions

    We are now trying to deploy our Deep Learning model onto Google Cloud. It is required to use Google ...

  4. vscode 中 eslint prettier 和 eslint -loader 配置关系

    前置 本文将探究 vscode prettier 插件 和 eslint 插件在 vscode 中的配置以及这两者对应的在项目中的配置文件的关系,最后提及 vscode eslint 插件配置与 es ...

  5. VSCode中使用vue项目ESlint验证配置

    如果在一个大型项目中会有多个人一起去开发,为了使每个人写的代码格式都保持一致,就需要借助软件去帮我们保存文件的时候,自己格式化代码 解决办法:vscode软件下载一个ESLint,在到设置里面找到se ...

  6. vscode编辑器自定义配置

    { //删除文件确认 "explorer.confirmDelete": false, // 主题 "workbench.iconTheme": "v ...

  7. vscode编辑器

    插件 Auto Close Tag   自动关闭标签 Auto Rename Tag 自动修改标签 Bracket Pair Colorizer  多层括号不同颜色显示 EditorConfig fo ...

  8. Vue2/3 项目中的 ESLint + Prettier 代码检测格式化风格指南

    Vue2/3 项目中的 ESLint + Prettier 代码检测格式化风格指南 因为平时都是使用 VSCode ESLint + Prettier 检测格式化不规范代码,但是随着接手的项目越来越多 ...

  9. VSCode插件及用户设置

    第一部分:插件 VSCode内置"emmet"插件,"convert to utf-8"等插件效果!十分强大!代码提示功能特别强悍! 插件地址:点击此处! 推荐 ...

随机推荐

  1. 「GIT SourceTree冲突」解决方案

    现在程序猿标配GIT作为代码管理,但是从SVN到GIT学习中,其中GIT的冲突是一个难点,常常会导致Push不上去,Pull不下来,很尴尬的地步,还不知道自己写的代码被覆盖没,废话不多说,直接上干货! ...

  2. dev的documentManager,多个tab窗体

    private void AddDocument(Funcation CurrentModel) { if (!string.IsNullOrWhiteSpace(CurrentModel.Funct ...

  3. asp.net mvc5 安装

    原文地址 http://docs.nuget.org/docs/start-here/using-the-package-manager-console 工具-->NuGet程序包管理器--&g ...

  4. 单因素方差分析(One Way ANOVA)

    Analysis of variance (ANOVA) is a collection of statistical models and their associated estimation p ...

  5. 机器翻译评价指标之BLEU详细计算过程

    原文连接 https://blog.csdn.net/guolindonggld/article/details/56966200 1. 简介 BLEU(Bilingual Evaluation Un ...

  6. [转]PHP 汉字转拼音

    转自: https://git.oschina.net/wapznw/php-pinyin <?php /** * @package default * @copyright php-pinyi ...

  7. 使用ASP.NET+Jquery DataTables的服务器分页

    (1)先建立表,看看表结构 (2)建立存储过程 DataTables是服务器分页,GetWxUsers存储过程使用了4个参数 (1) @start--表示当前第几页,例如第3页,start是从0开始 ...

  8. GFW实现原理

    GFW的工作机制主要包括: 1. IP黑名单 2. 内容审查 3. DNS劫持 参考链接:http://www.doc88.com/p-8435599803718.html

  9. 数据库savepoint

    保存点(savepoint)是事务过程中的一个逻辑点,我们可以把事务回退到这个点,而不必回退整个事务. 语法 编辑 savepoint savepoint_name 这个命令就是在事务语句之间创建一个 ...

  10. 深度学习Github排名,很不错的介绍

    今天看到这篇文章,把深度学习github排名靠前的项目,介绍了一下,很不错: https://blog.csdn.net/yH0VLDe8VG8ep9VGe/article/details/81611 ...