vscode中js文件和vue文件格式化分号和双引号的问题

本文讲述了在VS Code中遇到.js和.vue文件在使用Prettier格式化时自动添加分号和双引号的问题。作者尝试通过设置Prettier配置文件和修改settings.json未成功,最终选择了另一个格式化插件,并详细介绍了如何在settings.json中配置该插件,以实现使用Standard风格的Prettier,从而避免自动添加分号和双引号。

vs code编辑器运行vue项目时,.vue 文件和 .js 文件的规范是:不建议行尾有分号,字符串使用单引号不建议使用双引号的,如果项目中有 eslint 的话,那么就会经常报错。

我的习惯是喜欢打开 format on save (保存及格式化代码)选项,安装了prettier 插件,也在 settings.json 设置了如下:

    // vue文件默认格式化工具:vetur
    "[vue]": {
        "editor.defaultFormatter": "octref.vetur"
    },
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "semi": false,
            "singleQuote": true
        }
    },

但是 prettier 经常在格式化时还依然加上双引号和分号,也就是上面的配置不管用,查看 prettier 的配置有三种:

第一种和第二种都需要在项目中自己添加配置文件,想到每个项目都要这样,不能一劳永逸实在太麻烦。第三种的package.json文件不知道是不是项目中的package.json,如果是,那么跟前两种一样,每个项目都需要配置。如果不是的话,我就不清楚怎么配置了。

解决方法:

放弃使用了 prettier 插件来格式化代码,使用了下图的第三个插件,先前使用的是第一个。

然后在 settings.json 文件中把 JavaScript 格式化程序设置为第三个就没有自动加分号和双引号的问题了。

步骤:

如果没有默认的 JavaScript 格式化程序,在一个 js 文件中按下 alt+shift+f,然后右下角出现:

点击配置:

选择如图所示的带有 Standard 字样的 prettier 即可,点击之后,settings.json 文件中多了下面的配置代码:

    "[javascript]": {
        "editor.defaultFormatter": "numso.prettier-standard-vscode"
    },

也可以直接在 settings.json 文件中添加上图的代码,复制粘贴至 settings.json 即可。

然后再次格式化 .js 文件,就可以达到双引号变单引号、自动删除分号的效果。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值