VSCode single to double quote automatic replace

Question

When I execute a Format Document command on a Vue Component vue file VSCode replace all single quoted string with double quoted string   In my specific case this rule conflicts with electron-vue lint configuration that require singlequote   I don t have prettier extensions installed  no prettier singleQuote in my setting   How to customize VSCode to avoid this

User · Answer

As noted by  attdona the Vetur extension includes prettier   While you can change the prettier settings  as per the accepted answer  you can also change the formatter for specific regions of a vue component   Here  for example  I ve set Vetur to use the vscode-typescript formatter as it uses single quotes by default

User · Answer

Well for me both options solved the issue   By adding inside the  prettierrc -    quot singleQuote quot   true  Or by adding following inside the package json - gt   quot prettier quot      quot singleQuote quot   true     Though I tried also adding  prettierrc js and have following module exports     singleQuote  true    This didn t worked

User · Answer

I dont have prettier extension installed  but after reading the possible duplicate answer I ve added from scratch in my User Setting  UserSetting json  Ctrl   shortcut     prettier singleQuote   true   A part a green warning  Unknown configuration setting  the single quotes are no more replaced   I suspect that the prettier extension is not visible but is embedded inside the Vetur extension

User · Answer

It works for me to check single quote in Prettier as well   tslint autoFixOnSave as true

User · Answer

For newbies like me   From the menu Nav bar at the top   Select File -  Preferences -  Settings  In the search text box  type in Quote In the filtered list that appears below  look for the gear icon and next to it -   Prettier   Click on check box to enable  Prettier  Single Quote

User · Answer

Well  like the guy   user2982122  mentioned but instead of File go to Code -  Preferences -  Settings  then look for Quote  select Prettier and check both boxes

User · Answer

Try one of these solutions   In vscode settings json file add this entry  prettier singleQuote   true In vscode if you have  editorconfig file  add this line under the root     symbol quote type   single In vscode if you have  prettierrc file  add this line           singleQuote   true       vetur format defaultFormatterOptions              prettier                  singleQuote   true

User · Answer

Correct solution    I add  prettierrc js file in my main root project and write  module exports         singleQuote  true

User · Answer

Install prettier extension and paste below code in your VSCode settings json file   quot prettier useEditorConfig quot   false    quot prettier singleQuote quot   true  this will ignore your  editorconfig file setting

User · Answer

What worked for me was setting up the  prettierrc json config file  Put it to the root of your project with a sample config like this       quot singleQuote quot   true     quot trailingComma quot    quot all quot      quot tabWidth quot   2     quot semi quot   true     quot arrowParens quot    quot always quot     After triggering the Format Document command  all works just as expected  Side note  What comes as a bonus with this solution is that each team member gets the same formatting outputs thanks to the present config file

User · Answer

There only solution that worked for me  and only for Angular Projects   Just go into your project   editorconfig  file and paste  quote type   single   Hope it should work for you as well

User · Answer

I had the same issue in vscode  Just create a  prettierrc file in your root directory and add the following json  For single quotes add        singleQuote   true     For double quotes add              singleQuote   false

User · Answer

From the vuejs vetur issue page https   github com vuejs vetur issues 986  This solution worked for me   In VSCodes settings json file add this entry   vetur format defaultFormatterOptions          prettier              singleQuote   true

User · Answer

I added file called  prettierrc in my project folder  File content          singleQuote   true       vetur format defaultFormatterOptions              prettier                  singleQuote   true

User · Answer

It looks like it is a bug open for this issue  Prettier Bug  None of above solution worked for me  The only thing that worked was  adding this line of code in package json    prettier          singleQuote   true

User · Answer

For projects that use  editorconfig file by default  The formatter will ignore the rules in the settings and use the rules in  editorconfig  then you can either    Remove  editorconfig file  and use your VSCode settings  Add quote type   single to the  editorconfig file regarding your file type  You can also set quote type value to double or auto

User · Answer

For JSX use    quot jsxSingleQuote quot   false

User · Answer

You can use this in settings json   javascript preferences quoteStyle    single

User · Answer

quote type   single  add this inside  editorconfig   EditorConfig is awesome  https   EditorConfig org    top-most EditorConfig file root   true      indent style   space indent size   2 end of line   lf charset   utf-8 trim trailing whitespace   false insert final newline   false quote type   single

User · Answer

I m using typescript  for me it got resolved with checking  Tslint integration  flag under prettier settings  in vscode preferences

User · Answer

Use this extension   https   marketplace visualstudio com items itemName BriteSnow vscode-toggle-quotes  cmd    ctrl   on win Linux  will cycle among

User · Answer

please consider  editorconfig overwrites everything  use       quote type   single

[visual-studio-code] VSCode single to double quote automatic replace

Examples related to visual-studio-code

Examples related to vscode-settings