/template-for-layout-development

My main configuration for layout projects

Primary LanguageJavaScript

Автоматизация сборки проектов под верстку

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

Данный шаблон подойдет для проектов нацеленых на верстку, нежели на модульную JavaScript разработку.

Что включено?

Подробнее ознакомится с составом шаблона можете посмотрев package.json

Установка

Для установки можно клонировать репозиторий а затем выполнить: npm i

Или...

Скрипт для вашей консоли (iTerm/cmder)

Можно немного прокачать ваш терминал чтобы все делалось одной командой.

Чтобы все заработало необходимо найти конфигурационный файл вашего терминального приложения. (обычно находится в корневой папке пользователя) В моем случае это .zshrc, у вас может быть может быть .bashrc.

В конце конфига терминала нужно добавить следующее:

  • Алиасы для быстрого перехода в рабочую директорию
  • Функцию:
    • Переходит по ранее созданному алиасу в рабочую директорию
    • Создает новую директорию переданную как аргумент нашей функции
    • Клонирует в нее этот репозиторий
    • Перемещает все файлы и кофиги в созданную директорию
    • Удаляет хвосты от Git и саму папку от репо
    • Запускает установку всех зависимостей из package.json
    • Запускает IDE
    • Запускает Gulp с лайв сервером (browser-sync) и компиляцией *.scss файлов
alias workdir="cd way/to/your/work/folder/"

alias newproject=createNewProject

createNewProject() {
    workdir
    mkdir $1
    cd $1
    git clone git@github.com:oddman-lab/template-for-layout-development.git
    cd template-for-layout-development
    mv {.,}* ..
    cd ..
    rm -rf .git template-for-layout-development
    npm i
    git init
    code way/to/your/work/folder/$1
    gulp
}

P.S. code – это алиас для запуска VS Code, чтобы активировать его нужно выполнить в самом VS Code в палитре команд (CMD(Ctrl)+Shift+P)
>Shell Command: Install 'code' command in PATH
P.S.S. Если у вас другой редактор кода, надеюсь вы слегкостью разберетесь как запустить конкретно ваш редактор.
P.S.S.S. Скоро подобная сборка будет только для webpack 🤓