Angular Hot Loader


🔥 Webpack Hot Module Replacement for Angular 1.x applications.

Now works only with UI Router

Forked from Angular-HMR

Installation

- npm
``bash
npm install --save-dev angular-hot-loader
`

- yarn
`bash
yarn add --dev angular-hot-loader
`

Webpack setup

* Webpack 2.x:
`js
rules: [
{
test: /\.js$/,
use: [
'angular-hot-loader',
// Any other loaders.
]
}
]
`

With options:

`js
rules: [
{
test: /\.js$/,
use: [
{
loader: 'angular-hot-loader',
options: {
log: true,
rootElement: 'html'
}
},
// Any other loaders.
]
}
]
`

* Webpack 1.x:
`js
loaders: [
{
test: /\.js$/,
loader: 'angular-hot!...other loaders'
}
]
`

$3

See Webpack documentation:
- Webpack 2.x
- Webpack 1.x

Options

$3

Default: [ng-app]

Specifies application DOM root element selector. Use 'html' when boostraping your Angular app on document.

$3

Default: false

Enables module output to console.

How it works

This will inject the new controller / template / service / whatever and then reload the state in UI Router.

$3

`js
import MyFactory from './your-factory';
import MyCtrl from './your-controller';
import MyComponent from './your-component';

angular
.module('my-app', [ui.router])
.directive('MyDirective', require('MyDirective'))
.factory('MyFactory', MyFactory)
.controller('MyCtrl', MyCtrl)
.component('myComponent', MyComponent);
``