Add example of using TypeScript 2.1 + Webpack 2.1 + paths to help with #494

Author: SteveSandersonMS

templates/Angular2Spa/ClientApp/app/app.module.ts

@@ -5,7 +5,7 @@ import { AppComponent } from './components/app/app.component'
 import { NavMenuComponent } from './components/navmenu/navmenu.component';
 import { HomeComponent } from './components/home/home.component';
 import { FetchDataComponent } from './components/fetchdata/fetchdata.component';
-import { CounterComponent } from './components/counter/counter.component';
+import { CounterComponent } from 'ClientApp/app/components/counter/counter.component';
 
 @NgModule({
     bootstrap: [ AppComponent ],

templates/Angular2Spa/package.json

@@ -27,7 +27,7 @@
     "es6-shim": "^0.35.1",
     "event-source-polyfill": "^0.0.7",
     "expose-loader": "^0.7.1",
-    "extract-text-webpack-plugin": "^1.0.1",
+    "extract-text-webpack-plugin": "^2.0.0-beta",
     "file-loader": "^0.9.0",
     "html-loader": "^0.4.4",
     "isomorphic-fetch": "^2.2.1",
@@ -39,10 +39,10 @@
     "rxjs": "5.0.0-beta.12",
     "style-loader": "^0.13.1",
     "to-string-loader": "^1.1.5",
-    "ts-loader": "^0.8.2",
-    "typescript": "^2.0.3",
+    "ts-loader": "^1.3.0",
+    "typescript": "^2.1.0",
     "url-loader": "^0.5.7",
-    "webpack": "^1.13.2",
+    "webpack": "^2.1.0-beta",
     "webpack-hot-middleware": "^2.12.2",
     "webpack-merge": "^0.14.1",
     "zone.js": "^0.6.25"

templates/Angular2Spa/tsconfig.json

@@ -1,5 +1,11 @@
 {
   "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "*": [
+        "*"
+      ]
+    },
     "moduleResolution": "node",
     "target": "es5",
     "sourceMap": true,

templates/Angular2Spa/webpack.config.js

@@ -6,7 +6,13 @@ var merge = require('webpack-merge');
 // Configuration in common to both client-side and server-side bundles
 var sharedConfig = {
     context: __dirname,
-    resolve: { extensions: [ '', '.js', '.ts' ] },
+    resolve: {
+        extensions: [ '.js', '.ts' ],
+        modules: [
+            'node_modules',
+            '.'
+        ]
+    },
     output: {
         filename: '[name].js',
         publicPath: '/dist/' // Webpack dev middleware, if enabled, handles requests for this URL prefix
@@ -46,7 +52,7 @@ var clientBundleConfig = merge(sharedConfig, {
 
 // Configuration for server-side (prerendering) bundle suitable for running in Node
 var serverBundleConfig = merge(sharedConfig, {
-    resolve: { packageMains: ['main'] },
+    resolve: { mainFields: ['main'] },
     entry: { 'main-server': './ClientApp/boot-server.ts' },
     plugins: [
         new webpack.DllReferencePlugin({

templates/Angular2Spa/webpack.config.vendor.js

@@ -6,7 +6,7 @@ var merge = require('webpack-merge');
 var extractCSS = new ExtractTextPlugin('vendor.css');
 
 var sharedConfig = {
-    resolve: { extensions: [ '', '.js' ] },
+    resolve: { extensions: [ '.js' ] },
     module: {
         loaders: [
             { test: /\.json$/, loader: require.resolve('json-loader') },
@@ -68,7 +68,7 @@ var clientBundleConfig = merge(sharedConfig, {
 
 var serverBundleConfig = merge(sharedConfig, {
     target: 'node',
-    resolve: { packageMains: ['main'] },
+    resolve: { mainFields: ['main'] },
     output: {
         path: path.join(__dirname, 'ClientApp', 'dist'),
         libraryTarget: 'commonjs2',