fixes after using in prod

Author: davidmeirlevy

Diff for: template/config/webpack.config.base.js

@@ -1,50 +1,50 @@
 const helpers = require('./helpers'),
-  NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin'),
-  CopyWebpackPlugin = require('copy-webpack-plugin');
+    NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin'),
+    CopyWebpackPlugin = require('copy-webpack-plugin');
 
 let config = {
-  entry: {
-    'main': helpers.root('/src/main.ts')
-  },
-  output: {
-    path: helpers.root('/dist'),
-    filename: 'js/[name].[hash].js',
-    chunkFilename: 'js/[name].[hash].js',
-    publicPath: '/'
-  },
-  devtool: 'source-map',
-  resolve: {
-    extensions: ['.ts', '.js', '.html'],
-    alias: {
-      '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']
-      }
-    ],
-  },
-  plugins: [
-    new NamedModulesPlugin(),
-    new CopyWebpackPlugin([{
-      from: 'src/assets',
-      to: './assets'
-    }, ]),
-  ]
+    entry: {
+        'main': helpers.root('/src/main.ts')
+    },
+    output: {
+        path: helpers.root('/dist'),
+        filename: 'js/[name].[hash].js',
+        chunkFilename: 'js/[name].[hash].js',
+        publicPath: '/'
+    },
+    devtool: 'source-map',
+    resolve: {
+        extensions: ['.ts', '.js', '.html'],
+        alias: {
+            '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']
+            }
+        ],
+    },
+    plugins: [
+        new NamedModulesPlugin(),
+        new CopyWebpackPlugin([{
+            from: 'src/assets',
+            to: './assets'
+        }])
+    ]
 };
 
 module.exports = config;

Diff for: template/config/webpack.config.prod.js

@@ -1,119 +1,120 @@
 const glob = require('glob'),
-  path = require('path'),
-  CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin'),
-  UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin'),
-  HtmlWebpackPlugin = require('html-webpack-plugin'),
-  CompressionPlugin = require('compression-webpack-plugin'),
-  ExtractTextPlugin = require('extract-text-webpack-plugin'),
-  PurifyCSSPlugin = require('purifycss-webpack'),
-  FaviconsWebpackPlugin = require('favicons-webpack-plugin'),
-  autoprefixer = require('autoprefixer'),
-  webpackConfig = require('./webpack.config.base'),
-  helpers = require('./helpers'),
-  DefinePlugin = require('webpack/lib/DefinePlugin'),
-  env = require('../environment/prod.env');
+    path = require('path'),
+    CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin'),
+    UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin'),
+    HtmlWebpackPlugin = require('html-webpack-plugin'),
+    CompressionPlugin = require('compression-webpack-plugin'),
+    ExtractTextPlugin = require('extract-text-webpack-plugin'),
+    PurifyCSSPlugin = require('purifycss-webpack'),
+    FaviconsWebpackPlugin = require('favicons-webpack-plugin'),
+    autoprefixer = require('autoprefixer'),
+    webpackConfig = require('./webpack.config.base'),
+    helpers = require('./helpers'),
+    DefinePlugin = require('webpack/lib/DefinePlugin'),
+    env = require('../environment/prod.env');
 
 const extractSass = new ExtractTextPlugin({
-  filename: 'css/[name].[contenthash].css',
-  disable: process.env.NODE_ENV === 'development'
+    filename: 'css/[name].[contenthash].css',
+    disable: process.env.NODE_ENV === 'development'
 });
 
 const purifyCss = new PurifyCSSPlugin({
-  paths: glob.sync(path.join(__dirname, '../src/**/*.html')),
-  purifyOptions: {
-    info: true,
-    whitelist: []
-  }
+    paths: glob.sync(path.join(__dirname, '../src/**/*.html')),
+    purifyOptions: {
+        info: true,
+        whitelist: []
+    }
 });
 
 webpackConfig.module.rules = [...webpackConfig.module.rules,
-  {
-    test: /\.scss$/,
-    use: extractSass.extract({
-      use: [{
-          loader: 'css-loader',
-          options: {
-            minimize: true,
-            sourceMap: true,
-            importLoaders: 2
-          }
-        },
-        {
-          loader: 'postcss-loader',
-          options: {
-            plugins: () => [autoprefixer]
-          }
-        },
-        {
-          loader: 'sass-loader',
-          options: {
-            outputStyle: 'expanded',
-            sourceMap: true,
-            sourceMapContents: true
-          }
-        }
-      ],
-      // use style-loader in development
-      fallback: 'style-loader'
-    })
-  },
-  {
-    test: /\.(jpg|png|gif)$/,
-    loader: 'file-loader?name=assets/img/[name].[ext]'
-  },
-  {
-    test: /\.(eot|svg|ttf|woff|woff2)$/,
-    loader: 'file-loader?name=fonts/[name].[ext]'
-  }
+    {
+        test: /\.scss$/,
+        use: extractSass.extract({
+            use: [{
+                loader: 'css-loader',
+                options: {
+                    minimize: true,
+                    sourceMap: true,
+                    importLoaders: 2
+                }
+            },
+                {
+                    loader: 'postcss-loader',
+                    options: {
+                        sourceMap: true,
+                        plugins: () => [autoprefixer]
+                    }
+                },
+                {
+                    loader: 'sass-loader',
+                    options: {
+                        outputStyle: 'expanded',
+                        sourceMap: true,
+                        sourceMapContents: true
+                    }
+                }
+            ],
+            // use style-loader in development
+            fallback: 'style-loader'
+        })
+    },
+    {
+        test: /\.(jpg|png|gif)$/,
+        loader: 'file-loader?name=assets/img/[name].[ext]'
+    },
+    {
+        test: /\.(eot|svg|ttf|woff|woff2)$/,
+        loader: 'file-loader?name=fonts/[name].[ext]'
+    }
 ];
 
 // ensure ts lint fails the build
 webpackConfig.module.rules[0].options = {
-  failOnHint: true
+    failOnHint: true
 };
 
 webpackConfig.plugins = [...webpackConfig.plugins,
-  new CommonsChunkPlugin({
-    name: 'vendor',
-    minChunks: function(module){
-      return module.context && module.context.indexOf('node_modules') !== -1;
-    }
-  }),
-  new CommonsChunkPlugin({
-    name: 'manifest',
-    minChunks: Infinity
-  }),
-  extractSass,
-  purifyCss,
-  new HtmlWebpackPlugin({
-    inject: true,
-    template: helpers.root('/src/index.html'),
-    favicon: helpers.root('/src/favicon.ico'),
-    minify: {
-      removeComments: true,
-      collapseWhitespace: true,
-      removeRedundantAttributes: true,
-      useShortDoctype: true,
-      removeEmptyAttributes: true,
-      removeStyleLinkTypeAttributes: true,
-      keepClosingSlash: true,
-      minifyJS: true,
-      minifyCSS: true,
-      minifyURLs: true
-    }
-  }),
-  new UglifyJsPlugin({
-    include: /\.js$/,
-    minimize: true
-  }),
-  new CompressionPlugin({
-    asset: '[path].gz[query]',
-    test: /\.js$/
-  }),
-  new DefinePlugin({
-    'process.env': env
-  }),
-  new FaviconsWebpackPlugin(helpers.root('/src/icon.png'))
+    new CommonsChunkPlugin({
+        name: 'vendor',
+        minChunks: function (module) {
+            return module.context && module.context.indexOf('node_modules') !== -1;
+        }
+    }),
+    new CommonsChunkPlugin({
+        name: 'manifest',
+        minChunks: Infinity
+    }),
+    extractSass,
+    purifyCss,
+    new HtmlWebpackPlugin({
+        inject: true,
+        template: helpers.root('/src/index.html'),
+        favicon: helpers.root('/src/favicon.ico'),
+        minify: {
+            removeComments: true,
+            collapseWhitespace: true,
+            removeRedundantAttributes: true,
+            useShortDoctype: true,
+            removeEmptyAttributes: true,
+            removeStyleLinkTypeAttributes: true,
+            keepClosingSlash: true,
+            minifyJS: true,
+            minifyCSS: true,
+            minifyURLs: true
+        }
+    }),
+    new UglifyJsPlugin({
+        include: /\.js$/,
+        minimize: true
+    }),
+    new CompressionPlugin({
+        asset: '[path].gz[query]',
+        test: /\.js$/
+    }),
+    new DefinePlugin({
+        'process.env': env
+    }),
+    new FaviconsWebpackPlugin(helpers.root('/src/icon.png'))
 ];
 
 module.exports = webpackConfig;