Login/Register
Indentation Error with Sublime Text
Asked Answered
Solved htmlsublimetext3indentationauto-indenttext-indent
F

2

8

I'm trying to use the auto-indentation feature in Sublime Text 3 for HTML. I've got some block comments in the html and selecting Edit>Line>Reindent works until it hits a block comment.

Try to reindent the example here:

<html>
<head>
<title>Testing Indent</title>
</head>
<body>
<table>
<tr>
<td>
Cell 1
</td>
</tr>
<tr>
Cell 2
<!--Block Comment Here
And a Little More Here
-->
</tr>
</table>
</body>
</html>

and it turns out like this:

<html>
<head>
    <title>Testing Indent</title>
</head>
<body>
    <table>
        <tr>
            <td>
                Cell 1
            </td>
        </tr>
        <tr>
            <td>
                Cell 2
<!--Block Comment Here
And a Little More Here
-->
</td>
</tr>
</table>
</body>
</html>

Any thoughts?

Freddyfredek answered 7/7, 2016 at 14:25 Comment(3)
Does it work without the comment? – Chandelle
Yeah it indents just fine when it's Re-indented without the comment block. – Freddyfredek
can confirm, the exact issue happens to me with ST3 3103 – Vesperal
D
21

I have logged the issue here: https://github.com/SublimeTextIssues/Core/issues/1271

The reason for this behavior is because Sublime Text, by default, is set to preserve the indentation of comments. To disable this:

  1. Install Package Control if it is not already installed
  2. Install PackageResourceViewer if it is not already installed:
    • Open the Command Palette
    • Select Package Control: Install Package
    • Select PackageResourceViewer
  3. Open the Command Palette
  4. Type PRV: O
  5. Select PackageResourceViewer: Open Resource
  6. Select Default
  7. Select Indentation Rules - Comments.tmPreferences
  8. Change the <true/> under <key>preserveIndent</key> to <false/>
  9. Save the file

Reindentation will now work correctly with comments.

I would also recommend to edit the HTML indentation rules to ignore comments, so that it doesn't change indentation based on tags in comments. i.e. otherwise

<html>
<head>
<title>Testing Indent</title>
</head>
<body>
<table>
<tr>
<td>
Cell 1
</td>
</tr>
<tr>
Cell 2
<!--
Block Comment Here
<td>
And a Little More Here
</td>
-->
</tr>
</table>
</body>
</html>

would become:

<html>
<head>
    <title>Testing Indent</title>
</head>
<body>
    <table>
        <tr>
            <td>
                Cell 1
            </td>
        </tr>
        <tr>
            Cell 2
            <!--
            Block Comment Here
            <td>
                And a Little More Here
            </td>
        -->
    </tr>
</table>
</body>
</html>

To do this:

  1. Open Command Palette
  2. Type PRV: O
  3. Select PackageResourceViewer: Open Resource
  4. Select HTML
  5. Select Miscellaneous.tmPreferences

  6. Change

    <key>scope</key>
<string>text.html</string>

    to

    <key>scope</key>
<string>text.html - comment</string>

    and

    |--&gt;

    to

    (?#|--&gt;)

    (this comments out the closing comment regex)

  7. Save it

However, when the next release of ST3 is available, it might be a good idea to then delete your overrides, in case it is fixed properly. This way, you will continue to get updates to these files, otherwise you will be stuck with the versions you have saved. To do this:

  1. Preferences -> Browse Packages
  2. Delete the HTML folder
  3. Go into the Default folder and delete the Indentation Rules - Comments.tmPreferences file

If the problem wasn't fixed in the next build, you can simply recreate these changes.

Dree answered 8/7, 2016 at 7:47 Comment(2)
Awesome. Very good answer. I followed the steps and everything worked as expected. I appreciate the level of detail. I'll keep an eye out for future updates to this. – Freddyfredek
This package can also help to "fix" files that have broken indentation : packagecontrol.io/packages/Normalize%20Indentation – Coplin
V
1

Tried your example in Sublime Text 3 (builds 3103 and 3114) and you are right, the indentation breaks when it finds a comment block.

Apparently, the reindentation functionality was always pretty weak and HTML is not the only context where it doesn't work (EDIT: Confirmed in PHP too, pretty much the same behavior).

I'd recommend submitting the issue if it isn't already submitted.

Vesperal answered 7/7, 2016 at 18:26 Comment(2)
Thanks, I'll have a look and submit the issue of its not there already. – Freddyfredek
There is this issue github.com/SublimeTextIssues/Core/issues/1271 – Simmers

© 2022 - 2024 — McMap. All rights reserved.