Update hot reloading.

* Make hot reloading optional
* Minify CSS on build
* Implement Bootstrap v4
* Add standard linting for Javascript and Typescript
* Update npm packages

Author: ducksoupdev

CHANGELOG.md

@@ -1,5 +1,16 @@
 # Change log
 
+## [v1.3.0] (2018-01-31)
+
+**Features**
+
+* Minify CSS on build
+* Implement Bootstrap v4
+* Prompt for hot-reloading on project initialisation
+* Add `standard` for Javascript linting
+* Add `tslint-config-standard` for Typescript linting
+* Uplift npm packages
+
 ## [v1.2.1] (2018-01-08)
 
 **Features**
@@ -153,6 +164,7 @@
 [#3]: https://github.com/ducksoupdev/vue-webpack-typescript/pull/3
 [#2]: https://github.com/ducksoupdev/vue-webpack-typescript/pull/2
 [#1]: https://github.com/ducksoupdev/vue-webpack-typescript/pull/1
+[v1.3.0]: https://github.com/ducksoupdev/vue-webpack-typescript/compare/v1.2.1...v1.3.0
 [v1.2.1]: https://github.com/ducksoupdev/vue-webpack-typescript/compare/v1.2.0...v1.2.1
 [v1.2.0]: https://github.com/ducksoupdev/vue-webpack-typescript/compare/v1.1.1...v1.2.0
 [v1.1.1]: https://github.com/ducksoupdev/vue-webpack-typescript/compare/v1.1.0...v1.1.1

README.md

@@ -1,7 +1,7 @@
 # webpack-typescript
 
-> A Vue, Webpack and Typescript setup with hot reload, dynamic imports, unit testing, 
-code coverage, sass and bundling/minification.
+> A Vue, Webpack, Typescript, Bootstrap setup with hot reload, dynamic imports, unit testing, 
+code coverage, sass, uncss and bundling/minification.
 
 > This template is for Vue 2.5. See the [changelog](CHANGELOG.md) for updates.
 

meta.json

@@ -14,6 +14,11 @@
     "author": {
       "type": "string",
       "label": "Author"
+    },
+    "hotReload": {
+      "type": "confirm",
+      "message": "Use hot-reloading?",
+      "default": true
     }
   },
   "completeMessage": "To get started:\n\n  cd {{destDirName}}\n  npm install\n  npm run dev"

template/config/helpers.js

@@ -1,11 +1,10 @@
-const path = require('path');
+const path = require('path')
 
-// Helper functions
-const ROOT = path.resolve(__dirname, '..');
+const ROOT = path.resolve(__dirname, '..')
 
-function root(args) {
-  args = Array.prototype.slice.call(arguments, 0);
-  return path.join.apply(path, [ROOT].concat(args));
+function root (args) {
+  args = Array.prototype.slice.call(arguments, 0)
+  return path.join.apply(path, [ROOT].concat(args))
 }
 
-exports.root = root;
+exports.root = root

template/karma.coverage.js template/config/karma.coverage.js

@@ -1,26 +1,26 @@
-var parseArgs = require('minimist');
-var webpackConfig = require('./config/webpack.config.coverage');
+var parseArgs = require('minimist')
+var webpackConfig = require('./webpack.config.coverage')
 
 var args = parseArgs(process.argv.slice(2), {
   string: ['env'],
   default: {
     'env': 'mocha'
   }
-});
+})
 
-var reporters = ['mocha', 'coverage'];
+var reporters = ['mocha', 'coverage']
 
 if (args.env === 'tc') {
-  reporters = ['teamcity', 'coverage'];
+  reporters = ['teamcity', 'coverage']
 }
 
 if (args.env === 'jk') {
-  reporters = ['junit', 'coverage'];
+  reporters = ['junit', 'coverage']
 }
 
 module.exports = function (config) {
   config.set({
-    basePath: '',
+    basePath: '..',
     frameworks: ['mocha', 'chai', 'sinon'],
     files: [
       'node_modules/es6-promise/dist/es6-promise.auto.js',
@@ -54,5 +54,5 @@ module.exports = function (config) {
     },
     singleRun: true,
     concurrency: Infinity
-  });
-};
+  })
+}

template/karma.debug.js template/config/karma.debug.js

@@ -1,13 +1,13 @@
-var webpackConfig = require('./config/webpack.config.test');
+var webpackConfig = require('./webpack.config.test')
 
 module.exports = function (config) {
   config.set({
-    basePath: '',
+    basePath: '..',
     frameworks: ['source-map-support', 'mocha', 'chai', 'sinon'],
     files: [
       'node_modules/es6-promise/dist/es6-promise.auto.js',
       {
-        pattern: "node_modules/es6-promise/dist/es6-promise.auto.map",
+        pattern: 'node_modules/es6-promise/dist/es6-promise.auto.map',
         watched: false,
         included: false,
         served: true
@@ -29,14 +29,14 @@ module.exports = function (config) {
     colors: true,
     logLevel: config.LOG_INFO,
     autoWatch: true,
-    browsers: ["Chrome_with_debugging"],
+    browsers: ['Chrome_with_debugging'],
     customLaunchers: {
       Chrome_with_debugging: {
-        base: "Chrome",
-        flags: ["--remote-debugging-port=9222"],
+        base: 'Chrome',
+        flags: ['--remote-debugging-port=9222'],
         debug: true
       }
     },
     singleRun: false
-  });
-};
+  })
+}

template/karma.unit.js template/config/karma.unit.js

@@ -1,8 +1,8 @@
-var webpackConfig = require('./config/webpack.config.test');
+var webpackConfig = require('./webpack.config.test')
 
-module.exports = function(config) {
+module.exports = function (config) {
   config.set({
-    basePath: '',
+    basePath: '..',
     frameworks: ['mocha', 'chai', 'sinon'],
     files: [
       'node_modules/es6-promise/dist/es6-promise.auto.js',
@@ -23,5 +23,5 @@ module.exports = function(config) {
       'text/x-typescript': ['ts']
     },
     singleRun: true
-  });
-};
+  })
+}

template/config/webpack.config.base.js

@@ -1,6 +1,6 @@
-const helpers = require('./helpers'),
-  NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin'),
-  CopyWebpackPlugin = require('copy-webpack-plugin');
+const helpers = require('./helpers')
+const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin')
+const CopyWebpackPlugin = require('copy-webpack-plugin')
 
 let config = {
   entry: {
@@ -16,35 +16,35 @@ let config = {
   resolve: {
     extensions: ['.ts', '.js', '.html'],
     alias: {
-      'vue$': 'vue/dist/vue.esm.js',
+      'vue$': 'vue/dist/vue.esm.js'
     }
   },
   module: {
     rules: [{
-        test: /\.ts$/,
-        exclude: /node_modules/,
-        enforce: 'pre',
-        loader: 'tslint-loader'
-      },
-      {
-        test: /\.ts$/,
-        exclude: /node_modules/,
-        loader: 'awesome-typescript-loader'
-      },
-      {
-        test: /\.html$/,
-        loader: 'raw-loader',
-        exclude: ['./src/index.html']
-      }
-    ],
+      test: /\.ts$/,
+      exclude: /node_modules/,
+      enforce: 'pre',
+      loader: 'tslint-loader'
+    },
+    {
+      test: /\.ts$/,
+      exclude: /node_modules/,
+      loader: 'awesome-typescript-loader'
+    },
+    {
+      test: /\.html$/,
+      loader: 'raw-loader',
+      exclude: ['./src/index.html']
+    }
+    ]
   },
   plugins: [
     new NamedModulesPlugin(),
     new CopyWebpackPlugin([{
       from: 'src/assets',
       to: './assets'
-    }, ]),
+    } ])
   ]
-};
+}
 
-module.exports = config;
+module.exports = config

template/config/webpack.config.coverage.js

@@ -1,4 +1,4 @@
-const webpackConfig = require('./webpack.config.test');
+const webpackConfig = require('./webpack.config.test')
 
 webpackConfig.module.rules = [...webpackConfig.module.rules,
   {
@@ -13,6 +13,6 @@ webpackConfig.module.rules = [...webpackConfig.module.rules,
       esModules: true
     }
   }
-];
+]
 
-module.exports = webpackConfig;
+module.exports = webpackConfig

template/config/webpack.config.dev.js

@@ -1,28 +1,28 @@
-const helpers = require('./helpers'),
-  webpackConfig = require('./webpack.config.base'),
-  HtmlWebpackPlugin = require('html-webpack-plugin'),
-  DefinePlugin = require('webpack/lib/DefinePlugin'),
-  env = require('../environment/dev.env');
+const helpers = require('./helpers')
+const webpackConfig = require('./webpack.config.base')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const DefinePlugin = require('webpack/lib/DefinePlugin')
+const env = require('../environment/dev.env')
 
 webpackConfig.module.rules = [...webpackConfig.module.rules,
   {
     test: /\.scss$/,
     use: [{
-        loader: 'style-loader'
-      },
-      {
-        loader: 'css-loader'
-      },
-      {
-        loader: 'sass-loader'
-      }
+      loader: 'style-loader'
+    },
+    {
+      loader: 'css-loader'
+    },
+    {
+      loader: 'sass-loader'
+    }
     ]
   },
   {
     test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2)$/,
     loader: 'file-loader'
   }
-];
+]
 
 webpackConfig.plugins = [...webpackConfig.plugins,
   new HtmlWebpackPlugin({
@@ -33,7 +33,7 @@ webpackConfig.plugins = [...webpackConfig.plugins,
   new DefinePlugin({
     'process.env': env
   })
-];
+]
 
 webpackConfig.devServer = {
   port: 8080,
@@ -45,6 +45,6 @@ webpackConfig.devServer = {
   },
   contentBase: './src',
   open: true
-};
+}
 
-module.exports = webpackConfig;
+module.exports = webpackConfig