Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #451 (permalink)  
Старый 05.02.2015, 22:27
Аватар для kobezzza
Быдлокодер;)
Отправить личное сообщение для kobezzza Посмотреть профиль Найти все сообщения от kobezzza
 
Регистрация: 19.11.2010
Сообщений: 4,338

Сообщение от Gozar Посмотреть сообщение
http://www.youtube.com/watch?v=TspTov7AWog начиная с 2:10
Ну это просто более универсальный приём, т.к. были какие то проблемы (уже не помню какие) при использование такого подхода в cmd.exe, возможно проблем уже и нет

А в нормальной консоли это не нужно, хотя дело твоё.

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

Тут описаны все возможные кейсы использования CLI.
__________________
kobezzza
code monkey
Ответить с цитированием
  #452 (permalink)  
Старый 05.02.2015, 22:29
Аватар для Gozar
Отправить личное сообщение для Gozar Посмотреть профиль Найти все сообщения от Gozar
 
Регистрация: 07.06.2007
Сообщений: 7,504

Сообщение от kobezzza
в нормальной консоли это не нужно, хотя дело твоё.
Мне не старшно юзать ключи, я просто следовал твоей инструкции.
__________________
Последний раз редактировалось Gozar, Сегодня в 24:14.
Ответить с цитированием
  #453 (permalink)  
Старый 06.02.2015, 10:21
Аватар для Gozar
Отправить личное сообщение для Gozar Посмотреть профиль Найти все сообщения от Gozar
 
Регистрация: 07.06.2007
Сообщений: 7,504

snakeskin.compileFile как смотрел от корня проекта, так и смотрит, а не как require в node относительно текущего места.
__________________
Последний раз редактировалось Gozar, Сегодня в 24:14.
Ответить с цитированием
  #454 (permalink)  
Старый 06.02.2015, 10:32
Аватар для Gozar
Отправить личное сообщение для Gozar Посмотреть профиль Найти все сообщения от Gozar
 
Регистрация: 07.06.2007
Сообщений: 7,504

require('../tpl/header.ss').init(require('snakeskin'));

выдает вот такую забавную ошибку:
/server/app/tpl/header.ss:1
ction (exports, require, module, __filename, __dirname) { {template head(title
                                                                    ^^^^
SyntaxError: Unexpected identifier
    at Module._compile (module.js:439:25)
    at Object.Module._extensions..js (module.js:474:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:312:12)
    at Module.require (module.js:364:17)
    at require (module.js:380:17)
    at Object.<anonymous> (/server/app/modules/login.js:4:14)
    at Module._compile (module.js:456:26)
    at Object.Module._extensions..js (module.js:474:10)
    at Module.load (module.js:356:32)

При подключении скомпиленного шаблона.

Что-то я совсем не догоняю. Подключаю require('../tpl/header.ss'), но ведь это просто обёрнутая функция, там нет module.exports. Как тогда прекомпилить, если оно его не подхватит через require?
__________________
Последний раз редактировалось Gozar, Сегодня в 24:14.

Последний раз редактировалось Gozar, 06.02.2015 в 10:38.
Ответить с цитированием
  #455 (permalink)  
Старый 06.02.2015, 11:01
Аватар для kobezzza
Быдлокодер;)
Отправить личное сообщение для kobezzza Посмотреть профиль Найти все сообщения от kobezzza
 
Регистрация: 19.11.2010
Сообщений: 4,338

Сообщение от Gozar Посмотреть сообщение
snakeskin.compileFile как смотрел от корня проекта, так и смотрит, а не как require в node относительно текущего места.
Не может этого быть, ты уверен что у тебя юзается последняя версия (сделай npm up в проекте) ?

https://github.com/kobezzza/Snakeski...keskin.js#L110

Вот тут видно, что при резолвинге URL используется позиция родителя.

***

require('../tpl/header.ss.js').init(require('snakeskin'));


При таком подключении нужно подключать скомпиленый файл, а не файл-шаблонов.

https://github.com/kobezzza/Snakeski...oworld.node.js

Вот тут пример.

Вот пример скомпиленого файла.

https://github.com/kobezzza/Snakeski...lloworld.ss.js.

Цитата:
там нет module.exports
Там UMD экспорт.
__________________
kobezzza
code monkey

Последний раз редактировалось kobezzza, 06.02.2015 в 11:34.
Ответить с цитированием
  #456 (permalink)  
Старый 06.02.2015, 13:18
Аватар для Gozar
Отправить личное сообщение для Gozar Посмотреть профиль Найти все сообщения от Gozar
 
Регистрация: 07.06.2007
Сообщений: 7,504

Сообщение от kobezzza
сделай npm up в проекте
сделал, заработало. Спасибо, не знал, что так нужно.

У меня вопрос. Можно ли такое сделать и сразу еще вопрос правильно ли так делать?

Есть файл html.ss
{template html(head, body)}
    <!doctype html>
    <html lang="ru">
        {head}
        {body}
    </html>
{/template}


head и body отдельные файлы head.ss, body.ss

Читал про proto, но догнать не могу, как написать шаблоны и подключить правильно в nodejs? Можно пример?

В файле index.js :
var snakeskin = require('snakeskin');
var html = require('../tpl/html.ss.js').init(snakeskin);
var head = require('../tpl/head.ss.js').init(snakeskin);
var body = require('../tpl/body.ss.js').init(snakeskin);

html.html(head, body);


Далее мозг ломается...
__________________
Последний раз редактировалось Gozar, Сегодня в 24:14.

Последний раз редактировалось Gozar, 06.02.2015 в 13:30.
Ответить с цитированием
  #457 (permalink)  
Старый 06.02.2015, 13:59
Аватар для kobezzza
Быдлокодер;)
Отправить личное сообщение для kobezzza Посмотреть профиль Найти все сообщения от kobezzza
 
Регистрация: 19.11.2010
Сообщений: 4,338

Чёто тебя в странную степь понесло, ну да ладно.

1) Во первых (на всякий случай) в файле можно объявлять сколько угодно шаблонов, а не только один (этим SS принципиально отличается от того же Jade)

{template foo()}
   ...
{/}

{template bar()}
   ...
{/}

/// Можем использовать неймспейсы
{template some.foo.bar()}
   ...
{/}


2) Во вторых (тоже на всякий случай) в файл шаблона можно подключать другие файлы

{include 'myFile.ss'}
{include 'tpls/*.ss'}

/// Можно даже так
{eval}
    {forEach ['foo.ss', 'bar.ss'] => url}
        {include url}
    {/}
{/}

{template foo()}
   ...
{/}


А в JS вызывать один главный файл.

3) Как ты хочешь тоже можно, но я опишу самый лучший кейз - это использование наследования. Чтобы понять наследование в SS, то нужно просто привыкнуть к той мысле, что шаблон - это класс (в вики этому посвящён целый раздел).

Я всегда для начала завожу абстрактный шаблон, от которого потом будут наследоваться другие и определяют там базис и базисные методы.

base.ss

{template base(@params)}
    {doctype}
    <html>
        <head>
            {block head}
                /// Подключим базовые стили и скрипты
                {block script}
                    {script js src = base.js}{/}
                {/}

                {block style}
                    {link css}base.css{/}
                {/}
            {/block}
        </head>
  
        <body>
            {block body}
            {/block}
        </body>
    </html>
{/template}


Далее создают, например, profile.ss

{include 'base.ss'}

/// Наследуемся от базового шаблона и доопределяем / переопределяем структуру (это блоки, прототипы. константы и т.д.)
{template profile(params) extends base}
    {block script}
        {super}
        {script js src = profile.js}{/}
    {/}

    {block style}
        {super}
        {link css}profile.css{/}
    {/}

    {block body}
       <div class="foo">
           ...
       </div>
    {/}
{/template}


И т.д. уровень наследования не ограничен и не нужно боятся его использовать, т.к. на скорость конечно шаблона это вообще никак не повлияет.

Теперь про термины в наследовании:

1) Блоки (те, что я использовал в примере) - это как свойства класса, которые можно переопределить или доопределить в дочернем классе.
2) Константы и входные параметры - это свойства, которые можно также изменять при наследовании;
3) Прототипы - это протектед методы класса;
4) Вызываемые блоки - это публичные методы класса.

PS: В примере я использовал параметр с @ - это сахар для with биндинга,

https://github.com/kobezzza/Snakeskin/wiki/with
__________________
kobezzza
code monkey

Последний раз редактировалось kobezzza, 06.02.2015 в 14:02.
Ответить с цитированием
  #458 (permalink)  
Старый 06.02.2015, 14:09
Аватар для Gozar
Отправить личное сообщение для Gozar Посмотреть профиль Найти все сообщения от Gozar
 
Регистрация: 07.06.2007
Сообщений: 7,504

Да, да, то, что нужно. Конечно же мне подойдет наследование. Встроенный механизм хорошо.
__________________
Последний раз редактировалось Gozar, Сегодня в 24:14.
Ответить с цитированием
  #459 (permalink)  
Старый 06.02.2015, 14:23
Аватар для kobezzza
Быдлокодер;)
Отправить личное сообщение для kobezzza Посмотреть профиль Найти все сообщения от kobezzza
 
Регистрация: 19.11.2010
Сообщений: 4,338

Сообщение от Gozar Посмотреть сообщение
Да, да, то, что нужно. Конечно же мне подойдет наследование. Встроенный механизм хорошо.
Я бы сказал, что в SS он самый лучший (по сравнению с другими известными JS шаблонками)

Чтобы заюзать его на полную катушку, то обязательно прочитай про константы:

https://github.com/kobezzza/Snakeskin/wiki/const

Затем про блоки и прототипы (16-я глава).
А потом про наследование (18-я глава).

Например, я также на разных уровнях наследования определяю методы:

/// Можно объявлять как вне шаблона
{proto foo->getLogo(style)}
    ...
{/}

{block foo->getTitle()}
    ...
{/}

{template foo()}
   /// Так и внутри
   {proto getFavicon(style)}
       ...
   {/}
{/}


Их также можно выносить в отдельный файл.

Как ты уже наверное догадался, эти методы также наследуются и их можно переопределять и доопределять. Для вызова этих методов используется apply (для прототипов) и callBlock (для блоков).

{block bar->getTitle()}
    {super} /// super - это вызов тела родителя
    ...
{/}

{template bar() extends foo}
   {apply getStyle('dark')}
{/}


Внутри блоков/прототипов можно определять другие блоки/прототипы и так до бесконечности
__________________
kobezzza
code monkey

Последний раз редактировалось kobezzza, 06.02.2015 в 14:28.
Ответить с цитированием
  #460 (permalink)  
Старый 06.02.2015, 21:43
Аватар для Gozar
Отправить личное сообщение для Gozar Посмотреть профиль Найти все сообщения от Gozar
 
Регистрация: 07.06.2007
Сообщений: 7,504

html.ss
{template html(@params)}
    {doctype}
    <html lang="ru">
        <head>
            {block head}

                {block meta(title, kwd, des)}
                        <meta charset="UTF-8">
                        <title>{title}</title>
                        <meta name="keywords" content="{kwd}">
                        <meta name="description" content="{des}">
                {/}

                {block style}
                    {super}
                {/}

                {block script}
                    {super}
                {/}

            {/block}
        </head>

        <body>
            {block body}
            {/block}
        </body>
    </html>
{/template}

От него наследуется main.ss:

{include 'html.ss'}

{template main(params) extends html}

    {block meta(title, kwd, des)}
        {super}
    {/}

    {block style}
        {super}
        {link css}/css/style.css{/}
    {/}

    {block script}
        {super}
        {script js src = /js/lib/react.js}{/}
        {script js src = /js/lib/shim.js}{/}
    {/}

    {block body}
    {/}
{/template}


В ноде подключаем
var tpl = require('../tpl/main.ss.js').init(require('snakeskin'));
//а как вызывать?
tpl.html(); //работает
//как передать title, kwd, des?


как передать title, kwd, des?

var html = tpl.html().main().head.meta('Заголовок', 'ключевые, слова', 'Много Текста Описания');

Не фурыкает. Доку тоже рыл, не могу найти.
__________________
Последний раз редактировалось Gozar, Сегодня в 24:14.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
express-snakeskin - view через snakeskin для express melky Ваши сайты и скрипты 5 10.06.2014 11:35