Elm - Package Manager


A package manager is a command-line tool that automates the process of installing, upgrading, configuring, and removing packages in your application.

Just like JavaScript has a package manager called npm, elm has a package manager called elm-package.

The package manager performs the following three tasks −

  • Installs all dependencies that an elm application need
  • Publishes custom packages
  • Determines the version of your package when you are ready to publish and update.

Elm Package Manager Commands

The following table lists down the various Elm package manager commands −

Sr. No. Command Syntax Description
1 install elm-package install Installs packages to use locally
2 publish elm-package publish Publishes your package to the central catalog
3 bump elm-package bump Bumps version numbers based on API changes
4 diff elm-package diff Gets differences between two APIs

In order to publish your package, you need to host source code on GitHub and have the version properly labeled with a git tag. Following illustration shows how to use elm-package manager to pull an external dependency.

Illustration - Installing svg package

In this example, we will see how to integrate Scalable Vector Graphics(SVG) into an elm application.

Step 1 − Create a folder elmSvgApp

Step 2 − Install svg package using the following command −

elm-package install elm-lang/svg

Step 3 − Install Create a SvgDemo.elm file and type the content given below. We import Svg module to draw a rectangle of 100x100 dimension and fill the colour red.

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

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

Step 4 − Now build the project using elm make .\SvgDemo.elm. This will generate an index.html as shown below −

build project