https://github.com/andrewmacmurray/phoenix-elm-scaffold

Mix Task to generate an elm app inside a Phoenix (1.3) app
https://github.com/andrewmacmurray/phoenix-elm-scaffold

elixir elm mix-tasks phoenix

Last synced: 10 days ago
JSON representation

Mix Task to generate an elm app inside a Phoenix (1.3) app

• Host: GitHub
• URL: https://github.com/andrewmacmurray/phoenix-elm-scaffold
• Owner: andrewMacmurray
• License: bsd-3-clause
• Created: 2017-05-18T07:23:38.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2018-03-23T12:24:50.000Z (over 6 years ago)
• Last Synced: 2024-10-13T20:08:50.489Z (24 days ago)
• Topics: elixir, elm, mix-tasks, phoenix
• Language: Elixir
• Homepage: https://hexdocs.pm/phoenix_elm_scaffold/Mix.Tasks.Phx.Gen.Elm.html
• Size: 50.8 KB
• Stars: 37
• Watchers: 5
• Forks: 7
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Phoenix Elm Scaffold

Mix Task to generate an elm app inside a Phoenix (1.3) app with the necessary scaffolding

## Installation

Install the package by adding to `deps` and run `mix deps.get`

```elixir

def deps do

  [{:phoenix_elm_scaffold, "~> 0.2.6"}]

end

```

## Usage

To generate the scaffolding for an elm app, make sure you have [elm](https://guide.elm-lang.org/install.html) installed and run:

```sh

> mix phx.gen.elm

```

this will generate the following files and run install commands:

```

├── assets

│   ├── elm

│   │   ├── Main.elm

│   │   ├── State.elm

│   │   ├── Types.elm

│   │   └── View.elm

│   ├── elm-package.json

│   ├── js

│   │   └── elm-embed.js

├── lib

│   └── your_app

│       └── web

│           ├── controllers

│           │   ├── elm_controller.ex

│           ├── templates

│           │   ├── elm

│           │   │   └── index.html.eex

│           └── views

│               └── elm_view.ex

└── test

    └── elm

        ├── Main.elm

        ├── Sample.elm

        └── elm-package.json

```

after the command has finished follow the next steps:

1: add the following to the `plugins` section of your `brunch-config.js`

```js

elmBrunch: {

  elmFolder: ".", // Set to path where elm-package.json is located, defaults to project root

  mainModules: ['elm/Main.elm'],

  outputFile: 'elm.js',

  outputFolder: '../assets/js',

  makeParameters: ['--debug'] // optional debugger for development

}

```

2: add `elm` to the `watched` array in your `brunch-config.js`

   You may also want to add `/elm\\.js/` to the babel ignore pattern to speed up compilation

```js

babel: {

  ignore: [/vendor/, /elm\.js/]

}

```

3: in your `app.js` file add the following

```js

import ElmApp from './elm.js'

import elmEmbed from './elm-embed.js'

elmEmbed.init(ElmApp)

```

4: and finally in your `router.ex` file add

```elixir

get "/path-to-elm-app", ElmController, :index

```