Идея

Данная система генерации кода состоит из трёх частей: модели, шаблона и соединителя. Пользователь может свободно определять свою модель, правила и следовать этим правилам. Шаблон кода генерируется в соответствии с определёнными пользователем правилами. Я считаю, что шаблон, определённый самим пользователем, является лучшим шаблоном. Соединитель связывает модель и шаблон и определяет путь к файлу результата.

Шаблон

Синтаксис

Синтаксис похож на синтаксис Razor и вдохновлён Vash. Он ориентирован на генерацию кода и уделяет внимание форматированию кода, включая отступы и переносы строк. Поэтому был разработан собственный синтаксис шаблонов, использующий лексический анализатор, подобный тому, который используется в Jade.

1. Вывод типа кода с использованием @(<code>). Пример: @(model.name).
2. Логические блоки кода с использованием @{<code>}. Пример:

   @{
       let pName = ng.toPascalCase(name);
   }
3. Строчный текст с использованием @:<text>\n. Выведенный текст не будет заканчиваться символом новой строки.
4. Текстовые блоки с использованием @:{<text>@:}.
5. Экранирование с помощью @@, представляющего @.
6. Разделитель @!. Если необходимо вывести {xxx} в однострочном текстовом формате, можно использовать @:{xxx}, но это конфликтует с обозначением логического блока кода. Можно добавить разделитель @:@!{xxx} для вывода {xxx}.

Дополнительные примеры:

Шаблон для цикла for:

@{
    if(model && model.arr && model.arr.length){
        for(let i in model.arr){
            let item = model.arr[i];
            let split = i == 0 ? '' : (model.split || '');
@(split)@(ng.include(model.template, item))
        }
    }
}

Макет

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

Подшаблоны

Подшаблоны используются с помощью команды ng.include(<подшаблонFilePath>, <модель>).

Заполнитель

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

1. Используйте @[<placeHolderName>] для размещения заполнителя.
2. Используйте @[<placeHolderName>(,<tag>)]{<code>} для определения содержимого заполнителя.

Роль тега в заполнителе: Обычно при определении содержимого заполнителя без указания тега содержимое добавляется в заполнитель по умолчанию. Например, существует @[p]. В двух местах шаблона определено содержимое этого заполнителя.

@[p]{
@:paragraph1
}
@[p]{
@:paragraph2
}

В результате в позиции @[p] выводится текст paragraph1paragraph2. Если добавлен тег, то содержимое с одинаковым тегом добавляется только один раз.

@[p,tag1]{
@:paragraph1
}
@[p,tag1]{
@:paragraph2
}
@[p,tag2]{
@:paragraph3
}

Тогда в результате в позиции @[p] будет выведено paragraph1paragraph3, а вторая часть будет проигнорирована.

Перенос строк и отступы

Можно добавить пробелы для переноса строк и изменения режима отступов в командах ng.include и @[<placeHolderName>]. Вот конкретные шаги:

Пример использования ng.include: Пример:

<Form.Item label="@(model.display)" {...formItemLayout}>
    {getFieldDecorator('@(model.name)', {
        rules: [@(ng.include(' for', {arr: model.rules, template: 'frontend/create/rule', split: ',\n'}))]
    })(
        <Input @(model.isPassword ? ' type="password"' : '')
            placeholder="@(model.display)"
        />
    )}
</Form.Item>

Здесь в коде ng.include('for' перед «подшаблономFilePath» добавлены пробелы, поэтому при выводе будет такой эффект:

<Form.Item label="Name1" {...formItemLayout}>
    {getFieldDecorator('ccc', {
        rules: [{required: true, message: 'Must required'},
                {validator: this.emailValidate, message: 'Must be email format'}]
    })(
        <Input 
            placeholder="Name1"
        />
    )}
</Form.Item>

Если убрать пробелы:

<Form.Item label="@(model.display)" {...formItemLayout}>
    {getFieldDecorator('@(model.name)', {
        rules: [@(ng.include('for', {arr: model.rules, template: 'frontend/create/rule', split: ',\n'}))]
    })(
        <Input @(model.isPassword ? ' type="password"' : '')
            placeholder="@(model.display)"
        />
    )}
</Form.Item>

Результат будет таким:

<Form.Item label="Name1" {...formItemLayout}>
    {getFieldDecorator('ccc', {
        rules: [{required: true, message: 'Must required'},
                {validator: this.emailValidate, message: 'Must be email format'}]
    })(
        <Input 
            placeholder="Name1"
        />
    )}
</Form.Item>

То есть, если перед строкой добавлены пробелы, отступ при переносе строк будет соответствовать пробелам; если пробелы не добавлены, отступ будет соответствовать тексту.

Использование @[] Пример заполнителя:

import {
    Form@[ antd]
} from 'antd';

Определение содержимого заполнителя:

@[antd,input]{@:{,
Input@:}}

С пробелами результат будет следующим:

import {
    Form,
    Input
} from 'antd';

Без пробелов:

import {
    Form@[antd]
} from 'antd';

Результатом будет:

import {
    Form,
        Input
} from 'antd';

Модель

Пользователь может свободно определить JS-модель с различными правилами.

Встроенные атрибуты

Модель сама по себе

Члены модели

Для членов объекта: _ref: если определено ref: '<filePath>' (где <filePath> — это относительный путь к файлу модели относительно конфигурации модели), _ref будет указывать на соответствующую модель.

module.exports = {
    ccc: {
        display: 'Name1',
        ref: 'order-manage/test.js',
        rules:[{type: 'required', message: 'Must required'},{type: 'email', message: 'Must be email format'}]
    }
};

Файл конфигурации (включая соединитель)

Соединитель возвращает объект модели

Область действия поддерживает древовидную структуру, разделённую ., например, root может содержать root.module1, root.module1.module1_1. Если вы определили @[p]{<code>} в шаблоне области действия root.module1, вы можете использовать содержимое @[p] в шаблоне, определённом в области действия root.