How to remove extra indentation when compiling Jade in mixins?

C

ChrisJonson2016-03-27 19:33:31

HTML

ChrisJonson, 2016-03-27 19:33:31

Usually all jade mixins are included in a separate file and all mixins in it start without indents, but if the mixin needs to be entered inside the main document hierarchy, then extra indents are compiled

<!DOCTYPE html>
html
head
  title Document
body
  h1 Main title
  .content
    .inner-content
    
      mixin rand
        p Лишние отступы

      .text
        +rand

Extra padding appears in the output:

<!DOCTYPE html>
<html></html>
<head>
  <title>Document</title>
</head>
<body>
  <h1>Main title</h1>
  <div class="content">
    <div class="inner-content">
      <div class="text">
              <p>Лишние отступы</p>
      </div>
    </div>
  </div>
</body>

The mixin must be exactly in the document hierarchy to make it convenient to edit it. How to make extra indents disappear?

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

K

Konstantin Velichko, 2016-04-18
@ChrisJonson

Walk through the html with a pretifier using gulp-prettify for this with the following parameters

{
  'unformatted': ['pre', 'code'],
  'indent_with_tabs': true,
  'preserve_newlines': true,
  'brace_style': 'expand',
  'end_with_newline': true
}

You can see the full gulpfile here github.com/zoxon/gulp-front