Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

option to ignore section or line in html #575

Closed
johnwebbcole opened this issue Nov 11, 2014 · 10 comments
Closed

option to ignore section or line in html #575

johnwebbcole opened this issue Nov 11, 2014 · 10 comments

Comments

@johnwebbcole
Copy link

I'm using a lodash template with a custom tag set to [[ and ]] to prevent tags set with gulp from interfering with normal mustache tags.

Beautify is breaking one of these apart:

<script type="text/javascript">
  var defaults = [[- JSON.stringify(defaults, null, '\t') ]];
</script>

To:

<script type="text/javascript">
  var defaults = [
    [-JSON.stringify(defaults, null, '\t')]
  ];
</script>

I've tried to set the unformatted list for html in the .jsbeautifyrc but that didn't seem to have any effect.

Is there a way to prevent beautify from splitting this line? It would be nice to have a ignore line style comment similar to jshint or htmlhint. Perhaps adding another set of tags to the mustache support, so it could use {{ as well as [[.

Thx

@bitwiseman
Copy link
Member

If you set the script to something other than "text/javascript", it will be ignored. This remains unchanged:

<script type="text/lodash">
    var defaults = [[- JSON.stringify(defaults, null, '\t') ]];
</script>

The unformatted list should also work if you're using the most recent version. But that is a new feature, so it might be incomplete.

@goodpixels
Copy link

I think the best approach would be to ignore anything between HTML comments, for example:

<!--- prettify:ignore --><!-- /prettify -->

I quite often work with .NET projects which use Razor, and it would amazing if I could just exclude them from being processed.

Once the file finished processing, the beautifier could just remove <!--- prettify --> tags, to keep the source code clean.

Real world example

Source file:

@{

    ViewBag.Title = "Dashboard";
    string firstName = string.Empty;
    string userId = ViewBag.UserId;

    if( !string.IsNullOrEmpty(ViewBag.FirstName ) ) {

        firstName = "<h2>Hi " + ViewBag.FirstName + "</h2>";

    }

}


<header class="layout-header">

    <h2 id="logo"><a href="/">Logo</a></h2>

    <ul class="social">

        <li class="facebook"><a href="#">Facebook</a></li>
        <li class="twitter"><a href="#">Twitter</a></li>

    </ul>

</header>

Processed output:

@{ ViewBag.Title = "Dashboard"; string firstName = string.Empty; string userId = ViewBag.UserId; if( !string.IsNullOrEmpty(ViewBag.FirstName ) ) { firstName = "
<h2>Hi " + ViewBag.FirstName + "</h2>"; } }


<header class="layout-header">

    <h2 id="logo"><a href="/">Logo</a></h2>

    <ul class="social">

        <li class="facebook"><a href="#">Facebook</a>
        </li>
        <li class="twitter"><a href="#">Twitter</a>
        </li>

    </ul>

</header>

Proposed solution (input file):

<!-- prettify:ignore -->
@{

    ViewBag.Title = "Dashboard";
    string firstName = string.Empty;
    string userId = ViewBag.UserId;

    if( !string.IsNullOrEmpty(ViewBag.FirstName ) ) {

        firstName = "<h2>Hi " + ViewBag.FirstName + "</h2>";

    }

}
<!-- /prettify -->

<header class="layout-header">

    <h2 id="logo"><a href="/">Logo</a></h2>

    <ul class="social">

        <li class="facebook"><a href="#">Facebook</a></li>
        <li class="twitter"><a href="#">Twitter</a></li>

    </ul>

</header>

@bitwiseman
Copy link
Member

Excellent description. I don't know when this will happen but at least it is well documented. 👍

@kierzniak
Copy link

+1
It should also support comments from other file format:

html: <!-- prettify:ignore --> <!-- prettify:endignore -->
js: /* prettify:ignore */ /* prettify:endignore */, // prettify:ignore // prettify:endignore
css/scss/less: /* prettify:ignore */ /* prettify:endignore */, // prettify:ignore // prettify:endignore

Real world example from js:

var template = '<li>' +
                   '<div>' +
                       '<input type="checkbox" />' +
                   '</div>' +
                   '<div></div>' +
               '</li>';

After prettify:

var template = '<li>' +
'<div>' +
'<input type="checkbox" />' +
'</div>' +
'<div></div>' +
'</li>';

@bitwiseman
Copy link
Member

This has been implemented for javascript beautifier in #384. It addresses the issue as reported but I'm leaving this one open to track implementation on the html side.

@bitwiseman bitwiseman changed the title option to ignore section or line option to ignore section or line in html Nov 19, 2015
@FlorentMasson
Copy link

+1 for html

@beautifier beautifier deleted a comment from hyskyder Sep 27, 2017
@beautifier beautifier deleted a comment from luxueyan Sep 27, 2017
@cakeinpanic
Copy link

+1 for html

@gabrielmaldi
Copy link
Contributor

👍 Would love to be able to ignore HTML sections using comments 😄

@bitwiseman
Copy link
Member

See #944.

@bitwiseman
Copy link
Member

Fixed in c4f03cc

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

7 participants