https://github.com/dimpu/angularjs-hot-loader
AngularJS hot replacement for webpack
https://github.com/dimpu/angularjs-hot-loader
angular angularjs-hot-replacement webpack
Last synced: 3 months ago
JSON representation
AngularJS hot replacement for webpack
- Host: GitHub
- URL: https://github.com/dimpu/angularjs-hot-loader
- Owner: dimpu
- License: mit
- Created: 2017-09-22T03:08:15.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-09-23T21:38:01.000Z (over 8 years ago)
- Last Synced: 2025-04-03T16:08:11.551Z (9 months ago)
- Topics: angular, angularjs-hot-replacement, webpack
- Language: JavaScript
- Size: 399 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: readme.md
- License: LICENSE
Awesome Lists containing this project
README
# AngularJS Hot replacement for webpack
[](https://gitter.im/dimpu/angularjs-hot-loader?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
A Webpack loader for Hot Module Replacement in AngularJS applications.
This will only work in Ui Router at the moment with a specific app structure shown below. Will work on it a bit more over the week.
Throwing up a sample app up at https://github.com/dimpu/angularjs-hot-loader
## How to use
webpack.config.js
```js
const path = require('path');
const webpack = require('webpack');
module.exports = {
entry: [
'webpack-dev-server/client?http://localhost:3000',
'webpack/hot/only-dev-server',
'./src/index.js'
],
output: {
path: path.resolve(__dirname, 'dist'),
publicPath: '/dist/',
filename: 'index.bundle.js'
},
module: {
rules: [{
test: /\.js$/,
use: [
// 'angularjs-hot-loader',
'../index',
'babel-loader'
],
exclude: /node_modules/
}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin()
],
devServer: {
host: 'localhost',
port: 3000,
historyApiFallback: true,
// respond to 404s with index.html
hot: true,
// enable HMR on the server
},
}
```
```
angular
.module('app.components')
.directive('sessionItem',function() {
return {
restrict : 'E',
scope: {
session: '='
},
bindToController: true,
controllerAs: 'state',
replace: true,
controller: 'sessionItemCtrl',
template: require('./template.html')
};
})
.factory('TestFactory', function() {
console.log('derp');
})
.controller('sessionItemCtrl', require('./sessionItemCtrl'));
```
and you save that the browser should refresh