This guide will walk through setting up a Phoenix project with Elixirscript. This guide assumes you have already created a Phoenix project
Update: 2017-08-15: This guide has been updated to cover both ElixirScript 0.30 and Phoenix 1.3
Update your mix.exs file to add the current version of elixirscript to your dependencies:
defp deps do
[
#other deps
{:elixir_script, "~> x.x"}
]
Run mix deps.get
:
mix deps.get
Next, Add the elixir_script
compiler to your list of mix compilers. Also add in the elixir_script
configuration:
def project do
[app: :my_app,
version: "0.0.1",
elixir: "~> 1.2",
elixirc_paths: elixirc_paths(Mix.env),
compilers: [:phoenix, :gettext] ++ Mix.compilers ++ [:elixir_script],
build_embedded: Mix.env == :prod,
start_permanent: Mix.env == :prod,
deps: deps(),
elixir_script: [
input: MyApp.App,
output: "assets/js/build"
]
]
end
Make the input
the entry point module of your ElixirScript App. Here is will be MyApp.App
which we will
define later. Next, add the output
to the configuration and make it "assets/js/build"
. By default the output
goes to priv/elixir_script/build
, but we want to place our output somewhere that our asset compilation process can pick it up and bundle it with any other JavaScript.
Create app.ex
in the lib/my_app_frontend
directory
touch lib/my_app_frontend/app.ex
For this example, write a simple module that will write Hello, world
to the console on start:
defmodule MyApp.App do
def start(_type, _args) do
IO.puts("Hello, world")
end
end
Finally, update assets/js/app.js
to start your Elixirscript app:
import Elixir from './build/elixirscript.build.js';
Elixir.start(Elixir.MyApp.App, [])
The empty array is list of initial arguments for your app.
If you run mix compile
, you should see a JavaScript file, elixirscript.build.js
in your assets/js/build
directory.
If you run mix phx.server
, open your browser, and then open your console, you should see Hello, world
. Any changes should cause a recompilation of your ElixirScript code and a reload of the browser