Разработка

Custom item template in Visual Studio

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

Решение, представленное здесь простое в реализации, но позволяет экономить значительную часть времени разработки. Я хочу сказать о шаблонах элементов Вашего проекта. Зачастую такими элементами являются не только файлы *.cs; *.js; *.cpp, а сложные древовидные структуры каталогов, взаимосвязанных файлов и временами ссылок.

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

Подготовка

Для создания шаблона нам потребуется только идея и текстовый редактор. Мы будем создавать шаблон компонента для библиотеки knockout.js, который сосоит из двух файлов: html разметки и js-ой модели.

В своём проекте мы с коллегами используем require.js поэтому файл с моделью я сразу создам не пустой, а с небольшими набросками, опять же, для удобства.

Вот содержимое моего файла component.js. Имена файлов можно использовать любые, главное указать их в конфигурации представленной ниже.

Файл с разметкой component.html я оставляю пустым, так как единого шаблона не удалось выделить, корневые элементы всегда различны div; input; select; ul и прочие.

Файл с картинкой должен быть в формате ICO. Без труда Вы найдёте любой конвертер онлайн в интернете либо воспользуетесь хорошим редактором для его создания.

Настройка

Чтобы шаблон стал доступен в меню добавления  элемента в проект необходимо:

  1. Положить все файлы в папку C:\Users\<user_name>\Documents\Visual Studio 2013\Templates\ItemTemplates\JavaScript\<template_name>
  2. Перезапустить Visual Studio.

Главный файл <template_name>.vstemplate для моего решения представлен ниже

Обратите внимание на конструкцию вида $fileinputname$/$fileinputname$.html. С её помощью можо задавать любые пути для указания конечного местонахождение копируемых файлов после добавления элемента в проект.

Список файлов директории с шаблоном

Вот и всё, Ваш шаблон готов, перезагрузите IDE и пользуйтесь.

Leave a Reply

Your email address will not be published. Required fields are marked *