Post by gaoshou » Thu Jun 01, 2023 7:59 am

Hello, I have a question about formatting Twig files in Visual Studio Code. I have installed the prettier-plugin-twig-melody plugin to format my Twig files, but it doesn’t work well with the JavaScript code inside the Twig files. It either breaks the code into multiple lines or indents it too much. I have tried to adjust the settings in the .prettierrc.json file, but it still doesn’t look good. Is there any way to fix this problem? Or is there any other plugin that can format Twig files better? Thank you for your help.

Newbie

Posts

Joined
Thu Jun 01, 2023 7:57 am

Post by esolz » Tue Jun 06, 2023 7:52 pm

While the prettier-plugin-twig-melody plugin may not be working as expected for the JavaScript code within Twig files, there are two ways you can try:

1. Customizing Prettier Configuration:
Instead of adjusting the settings in the .prettierrc.json file, you can try customizing the Prettier configuration specifically for Twig files. Create a file called .prettierrc.js in the root directory of your project (if it doesn't exist already) and add the following code:

module.exports = {
plugins: ['prettier-plugin-twig-melody'],
overrides: [
{
files: '*.twig',
options: {
printWidth: 100, // Adjust this value as per your needs
// Add any other Prettier options you want to customize
},
},
],
};

<--------->
Make sure you have the prettier-plugin-twig-melody installed as a dependency in your project. Modify the options within the overrides section according to your desired formatting preferences for Twig files.

2. Alternative Twig Formatter:
If the above solution doesn't work well for your case, you can consider trying an alternative plugin specifically designed for Twig formatting. One such plugin is "Twig Language 2" by "mblode," which provides Twig language support along with formatting capabilities. You can install it from the Visual Studio Code extension marketplace and see if it provides better results for your Twig files.
To install the "Twig Language 2" extension, follow these steps:

Step1: Open Visual Studio Code.
Step2: Go to the Extensions view by clicking on the square icon in the sidebar or by pressing Ctrl+Shift+X.
Step3: Search for "Twig Language 2" in the search bar.
Step4: Click on the extension offered by "mblode" and click the "Install" button.
Step5: Once installed, reload Visual Studio Code if prompted.

After installing the extension, it should provide improved Twig language support and formatting capabilities for your Twig files.

I hope one of these two solutions resolves the formatting issues you're experiencing with Twig files in Visual Studio Code.

Create your digital impression with the expert online store makers here at Esolz Technologies, best OpenCart development company in India.
Esolz Technologies Pvt Ltd
Email: contact@esolzmail.com
Website: https://esolz.net/e-commerce-technology ... velopment/


User avatar
Newbie

Posts

Joined
Tue Jun 06, 2023 7:21 pm
Location - India
Who is online

Users browsing this forum: art999 and 38 guests