Блог

Что такое Git и для чего он нужен?

Git — для отслеживания и ведения истории изменения файлов в вашем проекте. Чаще всего его используют для кода.

С помощью Git-a вы можете откатить свой проект до более старой версии, сравнивать, анализировать или сливать свои изменения в репозиторий.

Репозиторием называют хранилище вашего кода и историю его изменений. Git работает локально, а все ваши репозитории хранятся в определенных папках на жестком диске.

Основные команды для работы с git:

git init — создание нового репозитория в текущей папке;
git add . — фиксирование изменений файлов, которые будут добавлены в коммит;
git commit -m "Закончил header" — создание нового коммита;
git push -u origin master — публикация указанной ветки в удаленном репозитории вместе со всеми необходимыми коммитами и внутренними объектами;
git status — текущее состояние файлов репозитория. Список измененных и не добавленных файлов.

Как упростить разработку темы для WordPress с возможностью применять команды git`a:

Из полезностей, максимально подробная работу со сборкой:

  • скачивание WordPress и заранее записанных плагинов одной командой;
  • минифицированный файл стилей;
  • минифицированный файл скриптов;
  • автоматическая оптимизация изображений;
  • разработка темы на scss;
  • автообновление браузера при изменении файлов стилей, скриптов и php файлов.

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

Настройка и первая установка сборки.

1) Установить node.js -> Node.js (Перезапусти ПК)

2) Установить Git -> Git

3) Скачать и установить Open Server -> OpenServer

4) Скачать и установить Composer-setup.exe -> Composer (getcomposer.org) (При установке выбрать путь к файлу php.exe из папки OpenServer и поставить галочку «Записать php.ini в path» Если галочки нет, то по ссылке можно прописать путь к php.ini вручную -> ручная установка) (Перезапустить ПК)

5) Заходим на диск, куда установили OpenServer, в моём случае это — D:\OpenServer\domains, в ней создаем папку с новым доменом для проекта — `mysite.loc`

6) В папку `mysite.loc` загрузить содержимое папки, скаченной с github репозитория. https://github.com/Code-Alex-Volkov/gulp-wp

7) Внутри папки mysite.loc, на пустом месте нажимаем пкм и выбираем Git Bash Here. Внутри открывшейся консоли запускаем команду `composer install` (Результатом выполнения этой команды должна стать появившаяся папка `wp` внутри папки `app`)

8) Там же, в консоли, запускаем команду `npm install` (В папке `mysite.loc` должна появится папка `node_modules`)

9) Там же, в консоли, запускаем команду `npm install -g gulp` — она установит gulp глобально.

10) Закидываем папку mysite.loc в рабочую область vscode, открываем терминал и запускаем команду `Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser` — Она разрешит vscode работать с gulp.

Дальше запустите OpenServer, в разделе Дополнительно->PhpMyAdmin создайте базу данных (логин и пароль root). В разделе Настройки->Домены в выпадающем списке «Управление доменами» выбирите «Ручное управление». В поле «Имя домена» запишите mysite.loc, а в поле «Папка домена» укажите путь до папки app внутри mysite.loc. Нажмите кнопку добавить.

В папке mysite.loc, в файле gulpfile.js значение переменной `siteUrl` переименуйте в `http://mysite.loc/`

В папке app сделайте дубликат файла `local-config.example.php` и переименуйте его в `local-config.php`. Заполните данные БД (DB_NAME, DB_USER, DB_PASSWORD, DB_HOST)

Пройдите по ссылке в 20-й строке и вставьте ключ в строки 22-29.

В браузере запишите путь к сайту http://mysite.loc и установите WordPress как обычно.

В админке, во вкладке `Настройки` найдёте `Адрес сайта (URL)` — уберите хвостик `/wp` и сохраните изменения. Переключите тему на `Gulp-Theme`.

В папке mysite.loc нажмите пкм и запустите Git Bash Here или воспользуйтесь терминалом vscode и запустите команду `gulp`.

ВСЁ проект запущен.

Если у кого-то не получилось всё сделать и нужна помощь, не стесняйтесь, пишите мне, я помогу разобраться. Разработка новой темы станет намного приятнее.

ВАЖНО

__________________________________________

Работа со стилями, скриптами и изображениями ведётся в папке `src`

Тема для работы находится по адресу: app/content/theme/gulp-theme

В файле composer.json можно записать список плагинов, который установится по умолчанию при запуске команды `composer install`

__________________________________________

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

1) php : Имя «php» не распознано как имя командлета, функции, файла сценария или выполняемой программы. Проверьте правильность написания имени, а также наличие и правильность пути, после чего повторите попытку. (Нужно записать путь к файлу php.ini -> ручная установка)

2) composer : Имя «composer» не распознано как имя командлета, функции, файла сценария или выполняемой программы. Проверьте правильность написания имени, а также наличие и правильность пути, после чего повторите попытку. (Выполнить пункт №4)

3) npm : Имя «npm» не распознано как имя командлета, функции, файла сценария или выполняемой программы. Проверьте правильность написания имени, а также наличие и правильность пути, после чего повторите попытку. (Выполнить пункт №1)

4) gulp : Имя «gulp» не распознано как имя командлета, функции, файла сценария или выполняемой программы. Проверьте правильность написания имени, а также наличие и правильность пути, после чего повторите попытку. (Выполнить пункт №9)

5) gulp : Невозможно загрузить файл C:\Users\mail\AppData\Roaming\npm\gulp.ps1, так как выполнение сценариев отключено в этой системе. Для получения дополнительных сведений см. about_Execution_Policies по адресу https:/go.microsoft.com/fwlink/?LinkID=135170. (Выполнить пункт №10)

Теги
Кнопка «Наверх»
Закрыть
Закрыть