Socket
Socket
Sign inDemoInstall

elm-hot

Package Overview
Dependencies
0
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

elm-hot

Hot code swapping for Elm


Version published
Maintainers
1
Weekly downloads
12,185
decreased by-12.24%

Weekly downloads

Readme

Source

elm-hot

elm-hot

This package provides the core infrastructure needed for doing hot code swapping in Elm. It supports Elm 0.19 only.

This low-level package is intended for authors of Elm application servers.

If you're looking for something that's easier to use, and you're willing to use Webpack, see elm-hot-webpack-loader, which is built using this package. Another option is Parcel which has built-in support for Elm and this package.

The goal of this package is to provide a reusable core that can be used to provide hot code swapping support in a variety of environments--not just Webpack.

Changelog

1.1.6

  • more lenient search for Browser.Navigation.Key in the generated JS
  • updated dependencies

1.1.5

  • update dependencies

1.1.4

  • fixed a bug where HMR failed because Browser.Navigation.Key changed location
  • fixed a crash when the app's Model contains Json.Encode.null

1.1.3

  • fixed a crash when using Elm debugger and elm/browser 1.0.2

1.1.2

  • fixed a bug where HMR would not work for very small ("toy") Elm projects

1.1.1

  • added support for Elm 0.19.1

1.0.1

  • bug fixes

1.0.0

  • improved Browser.application support (Browser.Navigation.Key can be stored anywhere in your model now)

0.9.1

  • separated the Webpack loader out into its own package
  • exposed core API

0.9.0

  • first release

Installing elm-hot core API

$ npm install --save elm-hot

Core API

function inject(str)

Injects the hot code swapping functionality into a compiled Elm app.

  • takes the Javascript code emitted by the Elm compiler as an input string
  • returns a string containing the injected code ready to be eval-ed in the browser.

Example of how the core API could be used

const elmHot = require('elm-hot');
const {compileToStringSync} = require('node-elm-compiler');
const injectedCode = elmHot.inject(compileToStringSync(["src/Main.elm"], {}));

In order to provide something similar to webpack-dev-server with hot module reloading, an application server could be developed to do the following:

  • serve a modified version of the app developer's index.html to receive push events from the server
  • watch .elm files on disk for changes
  • whenever a source file changes, push an event to the client notifying it that it should fetch new code from the server
  • when the client receives the event:
    • fetch the new code (the server will re-compile the Elm code and use elm-hot to inject the hot-code-swapping logic)
    • the client deletes the old Elm object and calls eval() on the new code from the server

I have implemented something similar to this for the integration tests. See test/server.js and test/client.js for inspiration.

The above description is probably a bit too vague, so if you would like more details, create an issue.


Attribution

Elm hot code swapping is based on the work of Flux Xu's elm-hot-loader.

Keywords

FAQs

Last updated on 27 Jan 2021

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc