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

This commit is contained in:
SteveSandersonMS
2016-12-07 16:36:01 +00:00
parent 633969c7b4
commit acdf18f19e
5 changed files with 21 additions and 9 deletions

View File

@@ -5,7 +5,7 @@ import { AppComponent } from './components/app/app.component'
import { NavMenuComponent } from './components/navmenu/navmenu.component'; import { NavMenuComponent } from './components/navmenu/navmenu.component';
import { HomeComponent } from './components/home/home.component'; import { HomeComponent } from './components/home/home.component';
import { FetchDataComponent } from './components/fetchdata/fetchdata.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({ @NgModule({
bootstrap: [ AppComponent ], bootstrap: [ AppComponent ],

View File

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

View File

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

View File

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

View File

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