CODEWITHSUNDEEP
elm
akonsu
akonsu

Reputation: 29538

import HTML.App as Html

The elm tutorial at http://guide.elm-lang.org/architecture/user_input/buttons.html has these lines:

import Html exposing (Html, button, div, text)
import Html.App as Html

I do not understand what the name Html references as the result of these imports. Is it Html.App or the function from Html package? And why.

Upvotes: 1

Views: 947

Answers (4)

Martin Janiczek
Martin Janiczek

Reputation: 3035

TL;DR:

If there is just Html, it's the type (originally Html.Html).

But if there's . after it, it's a module name and you can take definitions from both Html and Html.App modules by doing Html.something.

More in detail:

The result of import Html is that you can access Html.whateverHtmlExposes.

The result of the exposing (Html, button, div, text) is that you can write

  • Html instead of Html.Html (the type),
  • button instead of Html.button (function),
  • etc.

The result of import Html.App would be that you can access Html.App.whateverHtmlAppExposes, BUT because of the as Html part you can now write it like Html.whateverHtmlAppExposes.

Don't worry about conflicts - the compiler will warn you in that case:

-- NAMING ERROR ---------------------------------------------------------- C.elm

This usage of variable `A.x` is ambiguous.

9|     Html.text A.x
                 ^^^
Maybe you want one of the following?

    A.x
    B.x

Detected errors in 1 module.

Here I have imported B as A, both modules have x exposed:

A.elm

module A exposing (x)
x = "x from A"

B.elm

module B exposing (x)
x = "x from B"

C.elm

module C exposing (..)

import A
import B as A
import Html

main = Html.text A.x

Upvotes: 1

Jakub Hampl
Jakub Hampl

Reputation: 40533

import Html exposing (Html)

exposes the identifier Html in two different namespaces.

  1. The Html coming from the brackets part is a type. It's qualified name is Html.Html and it can only appear in Type signatures.
  2. The Html module which can only appear as a qualifier. Hence you could write Html.img and this refers to the part immediately after the import keyword.

Finally,

import Html.App as Html

imports the Html.App module and also gives it a local alias of Html. These don't shadow each other but as long as the actual function names are different in each module the compiler will resolve these correctly for you.

I generally avoid aliasing to the same thing since it makes the code confusing for me. But the compiler deals with it no problem.

Upvotes: 3

Tosh
Tosh

Reputation: 36030

Here is my understanding...

  • if Html is used alone then it refers to a type defined inside of Html module, and it can be used alone because it is exposed by import directive. (i.e. Html.Html)

  • Html.xx (xx is arbitrary, whichever Html.App module exposes) is xx exposed by module Html.App (i.e. Html.App.xx). And it cannot be used alone, because it is not imported with name spacing with a word Html.

Note that, a period . can only be name-spacing operator if the left-side word starts with a capital letter. And, only value (has to starts with a lower-case letter) can have properties, where . can also be used. (ModuleName.TypeName vs recordValue.property) So, it is not ambiguous.

But, if two modules expose same name (e.g. Html.xx and Html.App.xx) , then xx can become ambiguous and compiler would complain.

for example, when Html modules is imported with exposing (..)

I hope it makes sense...

Upvotes: 2

Thennarasan
Thennarasan

Reputation: 718

import Html.App as App

Its basically importing the application from html package. These functions will help you set up an Elm program that follows the Elm Architecture, a pattern for creating great code that stays great as your project grows.

Upvotes: 0

Related Questions