Учебники

Elm — менеджер пакетов

Диспетчер пакетов — это инструмент командной строки, который автоматизирует процесс установки, обновления, настройки и удаления пакетов в вашем приложении.

Так же, как в JavaScript есть менеджер пакетов под названием npm, в elm есть менеджер пакетов под названием elm-package .

Диспетчер пакетов выполняет следующие три задачи:

  • Устанавливает все зависимости, которые нужны приложению elm
  • Публикует пользовательские пакеты
  • Определяет версию вашего пакета, когда вы готовы к публикации и обновлению.

Elm Package Manager Команды

В следующей таблице перечислены различные команды менеджера пакетов Elm:

Старший команда Синтаксис Описание
1 устанавливать установка elm-пакета Устанавливает пакеты для локального использования
2 публиковать вяз-пакет публиковать Публикует вашу посылку в центральном каталоге
3 удар вяз-пакет Увеличивает номера версий на основе изменений API
4 разница вяз-пакет diff Получает различия между двумя API

Чтобы опубликовать ваш пакет, вам нужно разместить исходный код на GitHub и правильно пометить версию тегом git. На следующем рисунке показано, как использовать менеджер пакетов elm для извлечения внешней зависимости.

Иллюстрация — Установка пакета SVG

В этом примере мы увидим, как интегрировать масштабируемую векторную графику (SVG) в приложение Elm.

Шаг 1 — Создайте папку elmSvgApp

Шаг 2 — Установите пакет svg, используя следующую команду —

elm-package install elm-lang/svg

Шаг 3 — Установка Создайте файл SvgDemo.elm и введите содержимое, приведенное ниже. Мы импортируем модуль Svg, чтобы нарисовать прямоугольник размером 100×100 и залить красным цветом.

import Svg exposing (..)
import Svg.Attributes exposing (..)

main =
   svg
   [ width "120"
   , height "120"
   , viewBox "0 0 120 120"
   ]
   [ rect
      [ x "10"
      , y "10"
      , width "100"
      , height "100"
      , rx "15"
      , ry "15"
      ,fill "red"
      ]
      []
   ]

Шаг 4 — Теперь соберите проект, используя elm make. \ SvgDemo.elm. Это сгенерирует index.html, как показано ниже —