# ElixirScript - converts Elixir to JavaScript

**URL:** <https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409>\
**Category:** Announcing\
**Tags:** library, elixirscript\
**Created:** [November 16, 2016, 12:02am UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409 "2016-11-16T00:02:42Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [November 16, 2016, 12:02am UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/1 "2016-11-16T00:02:42Z")

</div>

Hi, I just published version 0.23.0 of [Elixirscript](https://github.com/elixirscript/elixirscript).

[https://github.com/bryanjos/elixirscript/blob/master/CHANGELOG.md](https://github.com/bryanjos/elixirscript/blob/master/CHANGELOG.md)

Most of the changes are around JavaScript interop now that Elixirscript uses the Elixir compiler to compile and load files during compilation. This also means you can define macros in the same file now. Another bonus is that this release makes it a bit easier to share code between Elixir and Elixirscript.

That’s about it. Try it out and any feedback is always helpful.

---

<div class="post-metadata">

**Author:** ![OvermindDL1](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/overminddl1/32/2677_2.png) [@OvermindDL1](https://forum.elixirforum.com/u/OvermindDL1)\
**Post date:** [November 16, 2016, 3:05pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/2 "2016-11-16T15:05:36Z")

</div>

I’ve been tempted to write a little webcomponent or polymer or so integration with it to see how it works, be a nice little bite-size thing to test with. 🙂

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [November 16, 2016, 3:43pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/3 "2016-11-16T15:43:07Z")

</div>

Nice! Let me know how it goes. I had written a small React example before for a local meetup, but never posted it online. I’m going to try to do that this week.

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [February 19, 2017, 7:41pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/4 "2017-02-19T19:41:22Z")

</div>

Hello I just published the latest version of Elixirscript. For a full list of the changes, take a look at the [changelog](https://github.com/elixirscript/elixirscript/blob/master/CHANGELOG.md#0250---2017-02-19) The major changes in this version are:

- Can select between ES, CommonJS, or UMD module formats for output
- Can use and compile dependencies in mix projects (if dependency has the elixirscript compiler in its mix compilers)
- Default input and output paths in mix projects

There is now an [elixirscript](https://github.com/elixirscript) organization with the projects that it uses. Also there is a newly created [blog](https://elixirscript.github.io/) with the first [post](https://elixirscript.github.io/post/elixirscript-0.25.0-released/) giving more details about the majors changes.

Finally, a [gitter room](https://gitter.im/elixirscript/elixirscript) was created for the project. The elixirscript channel on the elixir-lang slack still exists and I’ll still be there. The gitter room allows for integrations and keeps the history.

- Hex: [https://hex.pm/packages/elixir\_script](https://hex.pm/packages/elixir_script)
- Release on Github: [https://github.com/elixirscript/elixirscript/releases/tag/v0.25.0](https://github.com/elixirscript/elixirscript/releases/tag/v0.25.0)

---

<div class="post-metadata">

**Author:** ![OvermindDL1](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/overminddl1/32/2677_2.png) [@OvermindDL1](https://forum.elixirforum.com/u/OvermindDL1)\
**Post date:** [February 19, 2017, 8:50pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/5 "2017-02-19T20:50:41Z")

</div>

Ooo, awesome an update! 🙂

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [February 27, 2017, 12:50pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/6 "2017-02-27T12:50:01Z")

</div>

Elixirscript 0.26.0 has been released. The biggest change is that output is reduced to a single file.

For a summary of the major changes, check out the post [here](https://elixirscript.github.io/post/elixirscript-0.26.0-released/)

For a list of all changes, check out the [changelog](https://github.com/elixirscript/elixirscript/blob/master/CHANGELOG.md)

Hex: [elixir\_script | Hex](https://hex.pm/packages/elixir_script)  
Release on GitHub: [Release 0.26.0 · elixirscript/elixirscript · GitHub](https://github.com/elixirscript/elixirscript/releases/tag/v0.26.0)

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [February 27, 2017, 4:01pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/7 "2017-02-27T16:01:18Z")

</div>

@OvermindDL1 I’ve been looking at BuckleScript a lot lately. I know you are a fan of it. I’m wondering how do you like its JavaScript interoperability? [Redirecting to bucklescript.github.io/bucklescript](https://bloomberg.github.io/bucklescript/Manual.html#_ocaml_calling_js)

Wondering if maybe there are some things there that are worth borrowing for Elixirscript

---

<div class="post-metadata">

**Author:** ![OvermindDL1](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/overminddl1/32/2677_2.png) [@OvermindDL1](https://forum.elixirforum.com/u/OvermindDL1)\
**Post date:** [February 27, 2017, 4:33pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/8 "2017-02-27T16:33:51Z")

</div>

It’s Javascript typed bindings are just done via OCaml’s normal FFI system, it just all fit very well. 🙂

But yeah, I’d probably do something similar in Elixirscript. Last I saw Elixirscript you still did the JS.import bit (though now removed according to your just-now changelog ^.^), I’d probably do something like:

```elixir
defjsmodule Underscore, import_name: "_" do
  deffun blah/2
end

```

Or whatever, although you could add typing information like I’m doing in TypedElixir so you can cause compile-errors when interfaces are mis-used. 🙂

But yeah, OCaml’s FFI is just typing the interface, which the compiler then resolves to JS modules, it is very succinct and powerful and safe, as well as hard to borrow without having types in Elixir. ^.^

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [February 27, 2017, 5:19pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/9 "2017-02-27T17:19:38Z")

</div>

Ah that makes sense. Eventually I would like to get it to the point of requiring no JavaScript at all. It’s partially what the JS module is for right now, but could be built up to allow for more. The 2 systems that have impressed my so far are BuckleScript and Scala.js. But I guess both of those are type heavy examples. Anyways, I think there are somethings that can be done to get closer to that goal

---

<div class="post-metadata">

**Author:** ![Eiji](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/eiji/32/36743_2.png) [@Eiji](https://forum.elixirforum.com/u/Eiji)\
**Post date:** [February 27, 2017, 7:16pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/10 "2017-02-27T19:16:11Z")

</div>

@bryanjos: I saw docs at github and have some questions:

1. Do you support converting whole `Elixir` project into `JavaScript` app?  
I mean not only specified directory, but also `config`, `tests` and others?
2. Is it possible to prefix JavaScript calls in `Elixir` code? `:console.log("hello")` =\> `:js.console.log("hello")`. This could conflict with libraries (I mainly think about `:document`).
3. I have a problem with last (4144) line: `export default Elixir;`, I got error message: `SyntaxError: export declarations may only appear at top level of a module` in Firefox Nightly and `Uncaught SyntaxError: Unexpected token export` in Chrome.

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [February 27, 2017, 10:34pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/11 "2017-02-27T22:34:02Z")

</div>

@Eiji

1. Right now only a specific directory. I haven’t tested converting config or tests.

2. Not possible right now, but something that could be up for discussion. I know clojurescript does something similar and it may be a good idea here. There is the “JS” modules which can be the jumping off point for that.

3. Try using the “umd” format instead. The default is “es” which isn’t supported by browsers just yet

Edit: I probably need to do a good sweep of the docs to make sure they are up to date

---

<div class="post-metadata">

**Author:** ![Eiji](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/eiji/32/36743_2.png) [@Eiji](https://forum.elixirforum.com/u/Eiji)\
**Post date:** [February 27, 2017, 11:11pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/12 "2017-02-27T23:11:56Z")

</div>

@bryanjos: How I should start app?  
My code:

```html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8"/>
    <script src="Elixir.App.js"></script>
    <style>
      h1 { text-align: center; }
    </style>
    <title>Example</title>
  </head>
  <body>
    <h1>
      Example
    </h1>
    <script>
      Elixir.start(Elixir.Example, []); // like that?
    </script>
  </body>
</html>

```

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [February 28, 2017, 12:34am UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/13 "2017-02-28T00:34:04Z")

</div>

@Eiji that’s correct. So if you had a module named `Example` with a `start/2` function, running what you have would run it

---

<div class="post-metadata">

**Author:** ![Eiji](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/eiji/32/36743_2.png) [@Eiji](https://forum.elixirforum.com/u/Eiji)\
**Post date:** [February 28, 2017, 9:29am UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/14 "2017-02-28T09:29:33Z")

</div>

> [@bryanjos](#):
>
> @Eiji that’s correct. So if you had a module named Example with a start/2 function, running what you have would run it

`&Example.start/2` is what I have missed, thanks 😄

I have more questions:

1. Do you support defining classes? I’m interested in: [custom elements](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Custom_Elements/Custom_Elements_with_Classes) - it’s important for me.

2. Can I change JavaScript file name?

3. Do you support module and method docs?

4. How I can access other methods? Do I need to implement `&start/2` method for every module? I currently have this:

```javascript
Elixir.start(Elixir.Example, []);
Elixir.Example.__exports.hello();

```

1. I have a problem with `Logger`:

```elixir
** (RuntimeError) Module Logger not found
    lib/elixir_script/translator/lexical_scope.ex:361: ElixirScript.Translator.LexicalScope.check_for_module_existence/2
    lib/elixir_script/translator/lexical_scope.ex:314: ElixirScript.Translator.LexicalScope.add_require/2
    lib/elixir_script/translator.ex:469: ElixirScript.Translator.do_translate/2
    (elixir) lib/enum.ex:1325: Enum."-map_reduce/3-lists^mapfoldl/2-0-"/3
    (elixir) lib/enum.ex:1325: Enum."-map_reduce/3-lists^mapfoldl/2-0-"/3
    lib/elixir_script/translator/kernel/special_forms/block.ex:7: ElixirScript.Translator.Block.make_block/2
    lib/elixir_script/translator/kernel/defmodule.ex:88: ElixirScript.Translator.Defmodule.translate_body/2
    lib/elixir_script/translator/kernel/defmodule.ex:50: ElixirScript.Translator.Defmodule.process_module/3

```

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [February 28, 2017, 2:20pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/15 "2017-02-28T14:20:48Z")

</div>

There is no support for defining classes and that’s on purpose. But if someone can find an idiomatic Elixir way to add classes I am all for it. Even though Elixirscript can’t create classes, it can instantiate them with `JS.new/2`. I hardly ever use classes in JavaScript so it’s a low priority for me.

You can’t change the output name now, but it is something that can be allowed now. I can make an issue to update the output parameter to allow for that.

Does not support method and module docs. I don’t see a reason to since this is a compile target.

`start/2` is meant to be the “main” or entrypoint of your Elixirscript application. If you want to other modules outside of the Elixirscript scope then yes you would have to define start on them. or call `__load(Elixir)` directly or the module to load it and get an object returned with the functions defined on it.

Not all of the standard library is supported yet, but Logger may be a simple one to add. I’ll make an issue for it.

---

<div class="post-metadata">

**Author:** ![Eiji](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/eiji/32/36743_2.png) [@Eiji](https://forum.elixirforum.com/u/Eiji)\
**Post date:** [February 28, 2017, 2:26pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/16 "2017-02-28T14:26:56Z")

</div>

> [@bryanjos](#):
>
> Does not support method and module docs. I don’t see a reason to since this is a compile target.

Imagine that you prefer to use Elixir, but want to create a JavaScript library. As you know API docs are really useful for other developers.

---

<div class="post-metadata">

**Author:** ![Eiji](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/eiji/32/36743_2.png) [@Eiji](https://forum.elixirforum.com/u/Eiji)\
**Post date:** [February 28, 2017, 2:32pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/17 "2017-02-28T14:32:14Z")

</div>

> [@bryanjos](#):
>
> Not all of the standard library is supported yet, but Logger may be a simple one to add. I’ll make an issue for it.

The problem is that you already have it in docs in section called [Completed Modules](https://github.com/elixirscript/elixirscript/blob/master/FAQ.md#completed-modules):

> Completed Modules

- Tuple
- List
- Atom
- Range
- Logger
- Map
- MapSet

so I thought that I can use it already. What about create a `Logger` backend - is it a good way for you?

---

<div class="post-metadata">

**Author:** ![bryanjos](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bryanjos/32/1035_2.png) [@bryanjos](https://forum.elixirforum.com/u/bryanjos)\
**Post date:** [February 28, 2017, 2:43pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/18 "2017-02-28T14:43:50Z")

</div>

Good point 🙂 I’ll update the docs. There used to be an implementation in the earlier days but since I started implementing the standard library in elixir I never added one back.

---

<div class="post-metadata">

**Author:** ![Eiji](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/eiji/32/36743_2.png) [@Eiji](https://forum.elixirforum.com/u/Eiji)\
**Post date:** [February 28, 2017, 2:46pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/19 "2017-02-28T14:46:29Z")

</div>

> [@bryanjos](#):
>
> I am all for it. Even though Elixirscript can’t create classes,

You could write a simple `Macro` that creates `Module` with some info, for example in module attributes.

```elixir
defjsclass MyModuleName, :main do
  # shortcut for define variable getter
  defjsvariable :variable_name, :get
  # shortcut for define another variable getter and setter
  defjsvariable :another_variable_name, :both
  
  def main do
    # ...
  end
end

```

that should be visible like:

```elixir
defmodule MyModuleName do
  @elixir_script_class_constructor_method_name :main
  @elixir_script_is_class true

  # shortcut for define variable getter
  defjsvariable :variable_name, :get
  # shortcut for define another variable getter and setter
  defjsvariable :another_variable_name, :both

  def main do
    # ...
  end
end

```

---

<div class="post-metadata">

**Author:** ![OvermindDL1](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/overminddl1/32/2677_2.png) [@OvermindDL1](https://forum.elixirforum.com/u/OvermindDL1)\
**Post date:** [February 28, 2017, 4:21pm UTC](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409/20 "2017-02-28T16:21:32Z")

</div>

> [@bryanjos](#):
>
> There is no support for defining classes and that’s on purpose. But if someone can find an idiomatic Elixir way to add classes I am all for it.

\_cough: [https://github.com/wojtekmach/oop\_](https://github.com/wojtekmach/oop_)

Just a joke, but it works! ^.^

[Next page](https://forum.elixirforum.com/t/elixirscript-converts-elixir-to-javascript/2409.md?page=2)