Snakeskin

[kobezzza]

Фух, всё правильно работает

В test_html.ss.js нет, т.к. там ты объявил прототип, но нигде не вызывал и сборщик мусора SS декларацию выпилил, т.к. она не нужна оказалась.

А в test.ss.js нет, т.к. ты переопределил родительский для proto des блок и тем самым удалил его декларацию и сборщик мусора SS обнаружил, что на данный прототип нет больше ссылок и удалил его, т.е. это абсолютно правильное поведение, решать это можно двумя способами:

1) Вызов super в родительском блоке

{template main(param) extends html}
    {block body}
        {super}
        <div class="wrap">
                {apply des()}
        </div>
    {/}
{/template}

2) Явное указание использования прототипа

{template main(param) extends html}
    {proto des(des)}
        {super}
    {/}

    {block body}
        <div class="wrap">
                {apply des()}
        </div>
    {/}
{/template}

При таком подходе прототип будет вынесен из body, а body будет перезаписан.

PS: если не сложно, добавь мне в issue заданице описать это поведение в доке, а то у мя ща нет возможности, а если не добавить, то я забуду

UPD: повесил тикет по улучшению доки

[Gozar]

Давно хотел спросить.

Настроен watcher snakeskin в webstorm.

header.ss

тут делаем изменения

header.ss.js меняется, всё ок

html.ss

{include 'header.ss'}

html.ss.js Шаблон не знает об изменениях, все плохо

Если изменения делаются в подключаемом шаблоне, то все файлы в которых подкючается этот шаблон приходиться обновлять вручную.

Можно как-то отслеживать изменения в подключаемом файле и пересобирать зависимые от него шаблоны? Может есть команда глобальной пересборки хотябы?

Когда зависимый шаблон 1, то такое поведение терпимо, но когда их 10, это уже напрягает.

[kobezzza]

Это косяк вотчера WS, насколько мне известно, что у этой проблемы нет решения сейчас

НО, ты же можешь использовать вместо WS:

1) Встроенный вотчер Snakeskin (--watch в CLI, натрави SS на папку с этим флагом);
2) Вотчер от Gulp или Grunt.

Там таких проблем нет.

Может есть команда глобальной пересборки хотябы?

Это можно, в настройках файл вотчера WS задай компиляцию не отдельного файла, а всей папки, где лежат твои шаблоны.

snakeskin myTpls/ -o '%filePath%.js'

Тут компилится папка, а результаты сохраняются рядышком с исходными файлами, подробнее

https://github.com/kobezzza/Snakeski...0%BE%D0%B5-API

[Gozar]

kobezzza,
Спасибо за ответ. CLI-нул, все пересобралось норм.

А вот такой вопрос. А зачем компилятор пишет в комменты абсолютные пути к шаблонам? Это вроде как плохая практика.

[kobezzza]

А вот такой вопрос. А зачем компилятор пишет в комменты абсолютные пути к шаблонам? Это вроде как плохая практика.

Возможно это баг, надо проверить, спс за репорт.

[kobezzza]

Открыл для себя еще один кейз использования SS

Препроцессор для шаблонов под Angular, т.е. на этапе сборки проекта шаблоны компилятся с флагом exec и результатом является уже HTML, с которым работает Angular, а т.к. в SS есть директива {{ }}, то шаблон выглядит естественно и очевидно.

В общем, по мне, супер как удобно! Интересно опробовать такой же кейз для React.

[melky]

Открыл для себя еще один кейз использования SS

Препроцессор для шаблонов под Angular, т.е. на этапе сборки проекта шаблоны компилятся с флагом exec и результатом является уже HTML, с которым работает Angular, а т.к. в SS есть директива {{ }}, то шаблон выглядит естественно и очевидно.

В общем, по мне, супер как удобно! Интересно опробовать такой же кейз для React.

в терминах webpack это называется script-loader ...
имхо, переизобретаешь


но движуха с реактом мне нравится. ты же jsx имел в виду под "реактом" ?

[Gozar]

Интересно опробовать такой же кейз для React.

Я может чего не догоняю, но может подскажите какой в этом смысл?

Как объявлять?:

propTypes: {
   value: React.PropTypes.string.isRequired
}

getInitialState: function () {}

И т.д. и т.п.

У Реакта очень тесно связано объявление компонентов и обработка их поведения. Зачем туда пихать ещё и шаблонизатор, который будет делать что?

[kobezzza]

в терминах webpack это называется script-loader ...
имхо, переизобретаешь

Не понял о чём ты. Как шаблонка Angular никуда не годится, т.е. он занимается data-binding -ом, а SS - это именно шаблонка с умоохренительной системой code-reuse и кучей всякого сахара, а т.к. SS поддерживает синтаксис Angular из коробки, то такой гибрид действительно очень удобен и прост в использовании.

Я может чего не догоняю, но может подскажите какой в этом смысл?

Ну, я ещё даже не изучал вопрос, но мне видется, что Реакт - это скорее шаг назад, чем вперёд, т.к. там мы опять имеем вермишель из JS и разметки, непонятно что с code-reuse и т.д. Надо поизучать вопрос, мб я реализую интеграцию с JSX.

[kobezzza]

var HelloMessage = React.createClass({
  render: function() {
    return <div>Hello {this.props.name}</div>;
  }
});

VS

var HelloMessage = React.createClass({
  render: function() {
    return Snakeskin('myFile');
  }
});

# template HelloMessage()
    #< div
        Hello {this.props.name}

И такой шаблон вернёт шаблон React (в примере использован расширенный синтаксис директив #, чтобы можно было спокойно использовать React {}). В шаблонах SS мы можем юзать наследование, макросы, локализацию, БЭМ и кучу прочих фич и бесшовно интегрировать их с React.