Last active
December 25, 2015 09:55
-
-
Save ku/38a32bd358fbcc721796 to your computer and use it in GitHub Desktop.
angular 1.x hot module reload
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| require 'angular' | |
| require 'angular-route' | |
| window.app = app = angular.module('kz.app', [ | |
| 'ngRoute' | |
| ]) | |
| window.cp = null | |
| window.compileProvider = null | |
| app.config ($routeProvider, $controllerProvider, $compileProvider) -> | |
| window.cp = $controllerProvider | |
| window.compileProvider = $compileProvider | |
| $routeProvider.when '/me', { | |
| controller: 'meController', | |
| templateUrl: 'me.html' | |
| } | |
| console.log('loaded', new Date()) | |
| app.controller 'meController', require('./meController') | |
| app.directive.apply(app, require('./directive')) | |
| if module.hot | |
| console.log 'app' | |
| module.hot.accept() | |
| module.hot.dispose = -> | |
| console.log 'dispose requested', arguments | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| module.exports = do -> [ | |
| 'directive', -> | |
| restrict: 'E' | |
| replace: true | |
| priority: 108 | |
| scope: { | |
| } | |
| template: '<div class="directive chart"><h2>Directive directive</h2>{{word}}</div>' | |
| controller: ($scope) -> | |
| $scope.word = 'hello 84' | |
| ] | |
| if module.hot | |
| module.hot.accept() | |
| if window.compileProvider | |
| console.log(module.exports) | |
| window.compileProvider.directive.apply(window.compileProvider, module.exports) | |
| angular.element(document).injector().get('$route').reload() |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html ng-app="kz.app"> | |
| <head> | |
| <title>Untitled</title> | |
| <meta charset="utf-8"> | |
| <!--link rel="stylesheet" href="./style.css" type="text/css"--> | |
| <script src="http://localhost:4649/dist/main.js"></script> | |
| <script> | |
| window.onload = function () { | |
| console.log('onload') | |
| } | |
| </script> | |
| </head> | |
| <body> | |
| <h1>hot module reload</h1> | |
| <script > | |
| document.write(new Date()) | |
| </script> | |
| <div ng-view> | |
| </div> | |
| <directive></directive> | |
| <script type="text/ng-template" id="me.html"> | |
| <h2>me</h2> | |
| <blockquote> | |
| {{quote}} | |
| </blockquote> | |
| </script> | |
| <ol> | |
| <li>run <code>./node_modules/.bin/webpack-dev-server --config webpack.conf.js --port 4649 --inline</code></li> | |
| <li>open this index.html/#/me</li> | |
| </ol> | |
| </body> | |
| </html> | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| module.exports = ($scope) -> | |
| $scope.quote = 'hello world 107' | |
| if module.hot | |
| module.hot.accept() | |
| module.hot.addDisposeHandler -> | |
| console.log 'dispose requested', arguments | |
| # | |
| app = angular.module('kz.app') | |
| app.config ($controllerProvider) -> | |
| controllerProvider = $controllerProvider | |
| if window.cp | |
| window.cp.register 'meController', module.exports | |
| angular.element(document).injector().get('$route').reload() | |
| console.log 'meController registered' |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "name": "kaizen-dashboard", | |
| "private": true, | |
| "version": "0.0.0", | |
| "browserify": { | |
| "transform": [ | |
| "coffeeify" | |
| ] | |
| }, | |
| "devDependencies": { | |
| "coffee-script": "~1.10.0", | |
| "vinyl-source-stream": "^0.1.1", | |
| "webpack-dev-server": "~1.14.0", | |
| "coffee-loader": "~0.7.2", | |
| "angular-route": "~1.4.8" | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| webpack = require('webpack'); | |
| module.exports = { | |
| entry: { | |
| main: [ | |
| "webpack/hot/dev-server" , | |
| "./app.coffee" | |
| ], | |
| }, | |
| cache: true, | |
| display: { | |
| errorDetails: true | |
| }, | |
| output: { | |
| publicPath: 'http://localhost:4649/dist/', | |
| path: 'dist', | |
| filename: '[name].js' | |
| }, | |
| module: { | |
| preLoaders: [ ], | |
| loaders: [ | |
| { | |
| test: /\.coffee$/, | |
| loader: "coffee-loader" | |
| } | |
| ], | |
| postLoaders: [ | |
| ] | |
| }, | |
| resolve: { | |
| extensions: ["", ".coffee", ".js"] | |
| }, | |
| plugins: [ | |
| // new webpack.optimize.CommonsChunkPlugin("common.js"), | |
| new webpack.HotModuleReplacementPlugin() | |
| , new webpack.NoErrorsPlugin() | |
| ], | |
| devServer: { | |
| port: 4649, | |
| hot: true, | |
| contentBase: 'http://localhost:8080/hot' | |
| } | |
| }; | |
Author
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
assumes index.html is served at 'http://localhost:8080/hot'