feat(configurations): Simplify the web pack configuration using a single file. Add cross-env dependency

Author: emyann

README.md

@@ -8,9 +8,11 @@
 - [x] [Typescript 2](https://blogs.msdn.microsoft.com/typescript/2016/07/11/announcing-typescript-2-0-beta/)
 - [x] [Webpack Dashboard](https://github.com/FormidableLabs/webpack-dashboard)
 ![Imgur](http://i.imgur.com/pETTX85.png)
+
 # Getting started
 
 ## Clone Typescript Webpack Starter
+
 ```bash
 git clone https://github.com/emyann/typescript-webpack-starter.git
 cd typescript-webpack-starter
@@ -19,17 +21,25 @@ npm install
 ```
 
 ## Run
-Run a Webpack dev server 
+
+Start a Webpack dev server 
 ```bash
 npm start
 ```
 
+Start a Webpack server with the production configuration 
+```bash
+npm run server:prod
+```
+
+
 ## Build Only
 Build a development release
 ```bash
 npm run build
 ```
 
+
 Build a production release
 ```bash
 npm run build:prod

package.json

@@ -4,16 +4,14 @@
   "description": "A damn simple starter for Typescript and Webpack",
   "main": "src/index.ts",
   "scripts": {
-    "rimraf": "rimraf",
-    "webpack": "webpack",
-    "webpack-dev-server": "webpack-dev-server",
-    "start": "npm run start:dev",
-    "start:dev": "webpack-dashboard -- webpack-dev-server --config config/webpack/webpack.dev.js --port 3000 --host 0.0.0.0 --hot --inline --progress --profile --watch --content-base dist/",
+    "start": "npm run server:dev",
+    "server": "npm run server:dev",
+    "server:dev": "webpack-dashboard -- webpack-dev-server --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --inline --progress --profile --watch --content-base dist/",
+    "server:prod": "cross-env NODE_ENV=production webpack-dashboard -- webpack-dev-server --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --inline --progress --profile --watch --content-base dist/",
     "build": "npm run build:dev",
-    "prebuild:dev": "npm run rimraf -- dist",
-    "build:dev": "webpack --config config/webpack/webpack.dev.js --progress --profile --color --display-error-details --display-cached",
-    "prebuild:prod": "npm run rimraf -- dist",
-    "build:prod": "webpack --config config/webpack/webpack.prod.js  --progress --profile --color --display-error-details --display-cached --bail",
+    "build:dev": "webpack --config ./webpack.config.js --progress --profile --color --display-error-details --display-cached",
+    "build:prod": "cross-env NODE_ENV=production webpack --config ./webpack.config.js  --progress --profile --color --display-error-details --display-cached --bail",
+    "clean": "npm cache clear && rimraf -- dist",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
@@ -24,6 +22,7 @@
   "license": "ISC",
   "devDependencies": {
     "@types/lodash": "^4.14.50",
+    "cross-env": "^3.1.4",
     "css-loader": "^0.26.1",
     "ejs-loader": "^0.3.0",
     "eslint": "^3.14.0",

webpack.config.js

@@ -0,0 +1,66 @@
+const webpack = require('webpack');
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const DashboardPlugin = require('webpack-dashboard/plugin');
+const nodeEnv = process.env.NODE_ENV || 'development';
+const isProd = nodeEnv === 'production';
+
+var config = {
+    devtool: isProd ? 'hidden-source-map' : 'cheap-eval-source-map',
+    context: path.resolve('./src'),
+    entry: {
+        app: './index.ts',
+        vendor: './vendor.ts'
+    },
+    output: {
+        path: path.resolve('./dist'),
+        filename: '[name].bundle.js',
+        sourceMapFilename: '[name].map',
+        devtoolModuleFilenameTemplate: function (info) {
+            return "file:///" + info.absoluteResourcePath;
+        }
+    },
+    module: {
+        rules: [
+            { enforce: 'pre', test: /\.ts$/, exclude: ["node_modules"], loader: 'ts-loader' },
+            { test: /\.html$/, loader: "html" },
+            { test: /\.css$/, loaders: ['style', 'css'] }
+        ]
+    },
+    resolve: {
+        extensions: [".ts", ".js"],
+        modules: [path.resolve('./src'), 'node_modules']
+    },
+    plugins: [
+        new webpack.DefinePlugin({
+            'process.env': { // eslint-disable-line quote-props
+                NODE_ENV: JSON.stringify(nodeEnv)
+            }
+        }),
+        new HtmlWebpackPlugin({
+            title: 'Typescript Webpack Starter',
+            template: '!!ejs-loader!src/index.html'
+        }),
+        new webpack.optimize.CommonsChunkPlugin({
+            name: 'vendor',
+            minChunks: Infinity,
+            filename: 'vendor.bundle.js'
+        }),
+        new webpack.optimize.UglifyJsPlugin({
+            compress: { warnings: false },
+            output: { comments: false },
+            sourceMap: false
+        }),
+        new DashboardPlugin(),
+        new webpack.LoaderOptionsPlugin({
+            options: {
+                tslint: {
+                    emitErrors: true,
+                    failOnHint: true
+                }
+            }
+        })
+    ]
+};
+
+module.exports = config;