![]() The incorrect configuration above does two things wrong. #1 The example below shows what NOT to do! /** "settings.json" */ It configures the Official Prettier Formatting Extension for all of VSCode. The second configuration is the CORRECT CONFIGURATION TO USE. Which configures the formatter specific to a file extension, and it is configuring the wrong formatter The first example shows the improper configuration that you are currently using. I have included two examples of configuring your default formatter below. Your trying to use VS Codes Languag-features formatter to get the Prettier formatter to work. Currently you don't have the correct formatter configured. We also want to make sure that prettier is the formatter we are equipping. One formats all languages, the other formats HTML only. You just want prettier to be set as the default formatter, as opposed to the default formatter for HTML, there is a big difference between the two. Your trying to specify configurations on a per language basis, which is usually the wrong thing to do if your trying to configure a formatter to format more than one language or file type. You need to configure your default formatter in a generalized way to be able to format JavaScript & HTML. The link shows the official extensions page in the Visual Studio website view, you will probably want to download it inside of your editor as opposed to installing it via a VSIX file. To verify that it is the official extension, its unique extension ID will be: "esbenp.prettier-vscode". HERE IS THE LINK TO THE OFFICIAL PRETTIER EXTENSION You want to make sure that you have the OFFICIAL PRETTIER EXTENSION. There are many prettier extensions to choose from, but only one is the official prettier extension that was written by the same people who maintain prettier. Prettier is formatting HTML, but not JavaScript. "prettier.vueIndentScriptAndStyle": false, ![]() "prettier.htmlWhitespaceSensitivity": "css", "prettier.embeddedLanguageFormatting": "auto", "faultFormatter": "esbenp.prettier-vscode", "faultFormatter": "vscode.html-language-features" The ID for the Prettier extension that I currently have equipped in VS Code is: esbenp.prettier-vscode, and my settings.json file is configured as follows: Your settings will be saved and will be available when you visit this site the next time.I have not been able to configure prettier to format my HTML and JavaScript code only, I don't know what else to put in my configuration. To fine-tune these options click the dropdown icon and set the desired options with the check boxes. The main Tidy button performs the predefined HTML cleaning options on the source code. ![]()
0 Comments
Leave a Reply. |