- removed typings

- upgraded to angularjs 1.6, typescript 2.2 and webpack 2
- added angular-ts-decorators
- added tslint and .editorconfig

Author: sternbach

.editorconfig

@@ -0,0 +1,18 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 4
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.{js,ts,json,css,html}]
+indent_size = 2
+
+[*.md]
+trim_trailing_whitespace = false
+
+[Makefile]
+indent_style = tab

README.md

@@ -1,28 +1,13 @@
 # angularjs-typescript-webpack starter
 
-This project is an application skeleton for [AngularJS](http://angularjs.org/) 1.5 web app using new component syntax and typescript.
-
-It uses two different bunling systems webpack and systemjs, use the appropriate branch.
-
-Webpack branch has support for importing sass styles inline in the modules, for system js external stylesheets should be used, it has support for inline imports only with jspm.
+This project is an application skeleton for [AngularJS](http://angularjs.org/) 1.6+ web app using new component syntax, typescript 2 and webpack 2.
 
+Project uses [angular-ts-decorators](https://github.com/vsternbach/angular-ts-decorators) to mimic angular 2+ style development in angularjs environment with typescript and webpack.
 ## Getting Started
 
-To get you started you can simply clone the angularjs-typescript-webpack repository and install the dependencies:
-
-### Prerequisites
-
-You need git to clone the angularjs-typescript-webpack repository. You can get git from
-[http://git-scm.com/](http://git-scm.com/).
+To get you started you can simply clone the angularjs-typescript-webpack repository.
 
-We also use a number of node.js tools to initialize and test angular-seed. You must have node.js and
-its package manager (npm) installed.  You can get them from [http://nodejs.org/](http://nodejs.org/).
-
-Install these globally:
-
-```
-npm install -g webpack webpack-dev-server typings
-```
+Some of the project dependencies are used just for example and can be removed if not needed. 
 
 ### Clone angularjs-typescript-webpack
 
@@ -40,9 +25,9 @@ npm install
 
 ```
 src/                    --> all of the source files for the application
+  assets/           --> static app assets
   components/           --> all app specific modules
   services/                --> all app common services
-  assets/                --> all of the app static assets
   main.ts                --> main application module
   index.html            --> app layout file (the main html template file of the app)
 ```
@@ -51,8 +36,8 @@ src/                    --> all of the source files for the application
 
 The angularjs-typescript-webpack project comes preconfigured with a local development webserver. It is a webpack-dev-server, that supports hot reload.  You can start this webserver with `npm start`.
 
-Now browse to the app at `http://localhost:8080/`.
+Now browse to the app at `http://localhost:3000/`.
 
 ### Building and running the App in Production
 
-To build the application for production just run `npm bundle`, it creates dist directory that have the production optimized build.
+To build the application for production just run `npm build`, it creates dist directory that have the production optimized build.

package.json

@@ -1,34 +1,41 @@
 {
   "name": "angularjs-typescript-webpack",
   "private": true,
-  "version": "0.0.0",
+  "version": "1.0.0",
   "description": "Angularjs-typescript-webpack starter project",
   "repository": "https://github.com/vsternbach/angularjs-typescript-webpack",
   "license": "MIT",
   "devDependencies": {
-    "awesome-typescript-loader": "^0.17.0",
+    "@types/angular": "^1.6.7",
+    "@types/angular-ui-router": "^1.1.36",
+    "@types/jquery": "^2.0.40",
+    "@types/node": "^7.0.8",
+    "angular-ts-decorators": "0.0.23",
+    "awesome-typescript-loader": "^3.1.2",
     "copyfiles": "^0.2.1",
+    "cross-env": "^3.2.3",
     "css-loader": "^0.23.1",
-    "node-sass": "^3.4.2",
+    "html-loader": "^0.4.5",
+    "ng-annotate-loader": "^0.2.0",
+    "node-sass": "^4.5.0",
     "rimraf": "^2.5.2",
-    "sass-loader": "^3.2.0",
-    "style-loader": "^0.13.1",
-    "typescript": "^1.8.10",
-    "typings": "^1.0.4",
-    "webpack": "^1.13.1",
-    "webpack-dev-server": "^1.14.1"
+    "sass-loader": "^6.0.3",
+    "style-loader": "^0.13.2",
+    "tslint": "^4.5.1",
+    "typescript": "^2.2.1",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.4.1"
   },
   "dependencies": {
-    "angular": "^1.5.3",
-    "angular-sanitize": "^1.5.3",
-    "angular-ui-router": "^0.2.18",
+    "angular": "^1.6.3",
+    "angular-sanitize": "^1.6.3",
+    "angular-ui-router": "^1.0.0-rc.1",
     "ng-tags-input": "^3.0.0"
   },
   "scripts": {
-    "postinstall": "typings install",
     "prestart": "npm install",
-    "start": "webpack-dev-server --hot --port 8081",
-    "typings": "typings",
-    "bundle": "rimraf dist & copyfiles -f src/index.html dist/ & copyfiles -f src/assets/* dist/assets & webpack -p ./dist/bundle.js"
+    "start": "webpack-dev-server",
+    "webpack-prod": "cross-env NODE_ENV=production webpack --env.prod=true",
+    "build": "rimraf dist & copyfiles -f src/index.html dist/ & copyfiles -f src/assets/* dist/assets & npm run webpack-prod"
   }
 }

src/app.component.ts

@@ -0,0 +1,7 @@
+import { Component } from 'angular-ts-decorators';
+
+@Component({
+    selector: 'app',
+    template: `<comment-list></comment-list>`
+})
+export class AppComponent {}

src/app.config.ts

@@ -1,6 +1,6 @@
-import {AppComponent} from "./components/app.component";
-import {IComponentState} from "./decorators";
+import { IComponentState } from './main';
+import { AppComponent } from './app.component';
 
 export const routes: IComponentState[] = [
     { state: 'root', url: '/', component: AppComponent }
-];
+];