Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Range Ignore Support in HTML

See original GitHub issue

Prettier 1.15.2 Playground link

--parser html

Input:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <!-- prettier-ignore-start -->
  <%
    // - copies _all_ stage-specific configs from `./config/*.js` into the bundle,
    //   but only `./config/config.js` will be loaded
    // - by default we rename `config.local.js` to `config.js` for development,
    //   but on deployment to a specific stage the corresponding config will be renamed to `config.js`
    // - if you want to use a different config for local development pass `-e STAGE={stage-name}` to `yarn build`/`yarn watch`
    require.context('!copy-loader!./config/', true, /^\.\/.*\.js$/);
    require('!file-loader?name=./config/config.js!./config/config.local.js')
  %>
  <!-- prettier-ignore-end -->
  <script src="/v2/config/config<%= process.env.STAGE ? '.' + process.env.STAGE : '' %>.js"></script>
</body>
</html>

Output:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <!-- prettier-ignore-start -->
    <% // - copies _all_ stage-specific configs from `./config/*.js` into the
    bundle, // but only `./config/config.js` will be loaded // - by default we
    rename `config.local.js` to `config.js` for development, // but on
    deployment to a specific stage the corresponding config will be renamed to
    `config.js` // - if you want to use a different config for local development
    pass `-e STAGE={stage-name}` to `yarn build`/`yarn watch`
    require.context('!copy-loader!./config/', true, /^\.\/.*\.js$/);
    require('!file-loader?name=./config/config.js!./config/config.local.js') %>
    <!-- prettier-ignore-end -->
    <script src="/v2/config/config<%= process.env.STAGE ? '.' + process.env.STAGE : '' %>.js"></script>
  </body>
</html>

Expected behavior:

Keep Input.

Now that HTML support has landed in Prettier it would be nice, if we could use range ignore for the same reasons it is supported in Markdown.

💡 The best solution for the example above would be, if underscore templates could be treated as JavaScript, but range ignore would be a great start to mix HTML with several other templating flavors.

Issue Analytics

State:
Created 5 years ago
Reactions:16
Comments:5 (1 by maintainers)

Top GitHub Comments

2reactions

rootworkcommented, Sep 2, 2021

YAML frontmatter and HTML is an issue for other static site generators as well: Jekyll, Middleman, Assemble, and probably others.

Prettier supports range-ignore in Markdown files, which is great for SSGs like VuePress, Hugo, etc. But for the same reason it should support range-ignore in HTML files.

1reaction

lydellcommented, Jan 28, 2019

@jimmyhoran It’s up for grabs, go ahead! 👍

Top Results From Across the Web

<input type="range"> - HTML: HyperText Markup Language

<input> elements of type range let the user specify a numeric value which must be no less than a given value, and no...

Disable track on HTML5 range input - javascript - Stack Overflow

I'm trying to find a way to prevent the user from clicking into the "track" portion of an HTML5 range input. Essentially, I...

Selection and Range - The Modern JavaScript Tutorial

JavaScript can access an existing selection, select/deselect DOM nodes as a whole or partially, remove the selected content from the document, ...

Attributes and Tags Supported by Enhanced Typesetting

Enhanced Typesetting supports a wide range of attributes and tags. ... The following attributes are currently ignored when applied to any HTML tag....

MySQL 8.0 Reference Manual :: 5.1.11 Server SQL Modes

Modes affect the SQL syntax MySQL supports and the data validation checks it performs. ... Comparison of the IGNORE Keyword and Strict SQL...