• Node 14.18.3
• NVM/MacOC
• NVM/Windows Если Windows то установка только от имени администратора
• Yarn

Эта библиотека УСТАРЕЛА и больше не поддерживается, ее не используем в webpack. Место нее используем следующие библиотеки:

• "sass": "^1.69.7" (dart-sass) - это язык препроцессора CSS, который позволяет писать сложные стили в одном месте и использовать их в нескольких местах проекта.
• "postcss": "^8.4.33" - это инструмент для обработки CSS и добавления префиксов вендоров к его свойствам.
  • Обновить postcss-loader до версии не ниже 4.0.3 - это загрузочный модуль для Webpack, который позволяет использовать инструменты для обработки CSS в процессе сборки проекта.
  • Обновить postcss-cli до версии не ниже 8.0.0 - это интерфейс командной строки для инструментов PostCSS.

• "@babel/core": "7.18.6" - это компилятор JavaScript, который используется для преобразования кода на JavaScript в более эффективный и переносимый формат.
• "@babel/preset-env": "7.5.5" - это набор настроек для компилятора Babel, который позволяет использовать устаревшие функции JavaScript.
• "babel-loader": "8.0.6" - это загрузочный модуль, который позволяет использовать компилятор Babel в процессе сборки проекта.

• "webpack": "^4.41.2" - это инструмент для сборки проектов, который объединяет и минифицирует код и ресурсы проекта в один файл.

• "webpack-cli": "^3.3.12" - это интерфейс командной строки для инструмента Webpack.

• "webpack-dev-server": "^3.11.0" - это сервер разработки для инструмента Webpack, который позволяет отлаживать и тестировать проект в браузере.

• "file-loader": "4.2.0" - это загрузочный модуль для Webpack, который позволяет загружать файлы в проект из их пути в файловой системе.

• "copy-webpack-plugin": "5.1.0" - это плагин для Webpack, который позволяет копировать файлы из одного места в другое в процессе сборки проекта.

• "css-loader": "3.2.0" - это загрузочный модуль для Webpack, который позволяет импортировать и использовать CSS файлы в проекте.

• "mini-css-extract-plugin": "0.8.0" - это плагин для Webpack, который позволяет извлекать CSS из проектов и упаковывать его в отдельные файлы.

• "autoprefixer": "^10.4.16" - это инструмент для добавления префиксов вендоров к CSS свойствам, чтобы обеспечить совместимость с различными браузерами.

• "sass-loader": "^7.2.0" - это загрузочный модуль для Webpack, который позволяет использовать язык Sass в проекте.

• "html-webpack-plugin": "3.2.0" - это плагин для Webpack, который позволяет создавать HTML файлы из шаблонов и вставлять в них статические ресурсы проекта.

Должно вывести версию ноды 14.18.3

node -v

Установка зависимостей через NPM

npm install

Установка зависимостей через Yarn

yarn

Для запуска веб-сервера через NPM

npm run start

Для запуска веб-сервера через Yarn

yarn start

Загрузка на Github Pages через NPM

npm run deploy

Загрузка на Github Pages через Yarn

yarn deploy

Основано на этой статье