Вяз - базовый синтаксис
В этой главе обсуждается, как написать простую программу на elm.
Step 1 − Create a directory HelloApp in VSCode
Теперь создайте файл - Hello.elm в этом каталоге.
На приведенной выше диаграмме показана папка проекта. HelloApp и терминал открыт в VSCode.
Step 2 − Install the necessary elm packages
Менеджер пакетов в elm - это elm-package . Установите пакет elm-lang / html . Этот пакет поможет нам отобразить вывод кода elm в браузере.
Переход к HelloApp папку проекта, щелкнув правой кнопкой мыши Файл → Открыть в командной строке в VSCode.
Выполните следующую команду в окне терминала -
C:\Users\dell\Elm\HelloApp> elm-package install elm-lang/html
Следующие файлы / папки добавляются в каталог проекта при установке пакета.
- elm-package.json (файл), хранит метаданные проекта
- elm-stuff (папка), хранит внешние пакеты
Следующее сообщение появится после успешной установки пакета.
Step 3 − Add the following code to the Hello.elm file
-- importing Html module and the function text
import Html exposing (text)
-- create main method
main =
-- invoke text function
text "Hello Elm from TutorialsPoint"
Вышеупомянутая программа отобразит строковое сообщение Hello Elm from TutorialsPoint в браузере.
Для этого нам нужно импортировать функцию text в пределах Htmlмодуль. Текстовая функция используется для печати любого строкового значения в браузере. Основной метод - это точка входа в программу. Основной метод вызывает текстовую функцию и передает значение строки к нему.
Step 4 − Compile the project
Выполните следующую команду в окне терминала VSCode.
elm make Hello.elm
Результат выполнения вышеуказанной команды показан ниже -
//update path to the proj folder in the command elm make
C:\Users\dell\elm\HelloApp>elm make Hello.elm
Success! Compiled 38 modules.
Successfully generated index.html
Приведенная выше команда сгенерирует index.htmlфайл. Компилятор elm преобразует файл .elm в JavaScript и встраивает его вindex.html файл.
Step 5 − Open the index.html in the browser
Откройте файл index.html в любом браузере. Результат будет таким, как показано ниже -
Комментарии в Elm
Комментарии - это способ улучшить читаемость программы. Комментарии могут использоваться для включения дополнительной информации о программе, такой как автор кода, подсказки о конструкции функции и т. Д. Комментарии игнорируются компилятором.
Elm поддерживает следующие типы комментариев -
Однострочные комментарии (-) - Любой текст между - и концом строки рассматривается как комментарий.
Многострочные комментарии ({- -}) - эти комментарии могут занимать несколько строк.
Иллюстрация
-- this is single line comment
{- This is a
Multi-line comment
-}
Линии и отступы
В Elm нет фигурных скобок для обозначения блоков кода для определений функций или управления потоком. Блоки кода обозначаются строковым отступом, который строго соблюдается. Все операторы в блоке должны иметь одинаковый отступ. Например -
module ModuleIf exposing (..)
x = 0
function1 =
if x > 5 then
"x is greater"
else
"x is small"
Однако следующий блок генерирует ошибку -
-- Create file ModuleIf.elm
module ModuleIf exposing (..)
x = 0
function1 =
if x > 5 then
"x is greater"
else --Error:else indentation not at same level of if statement
"x is small"
Таким образом, в Elm все непрерывные линии с одинаковым количеством пробелов образуют блок.
C:\Users\admin>elm repl
---- elm-repl 0.18.0 -----------------------------------------------------------
:help for help, :exit to exit, more at
<https://github.com/elm-lang/elm-repl>
---------------------------------------
-----------------------------------------
> import ModuleIf exposing(..) -- importing module from ModuleIf.elm file
>function1 -- executing function from module
-- SYNTAX PROBLEM ---------------------------------------------------
I need whitespace, but got stuck on what looks like a new declaration.
You are either missing some stuff in the declaration above or just need to add some spaces here:
7| else
^
I am looking for one of the following things:
whitespace