Merge branch 'hotfix/update-webpack-deprecations'

SimulatedGREG · SimulatedGREG · commit d7adb78b10a3 · 2017-02-17T23:57:43.000-06:00
diff --git a/template/app/src/renderer/vuex/store.js b/template/app/src/renderer/vuex/store.js
@@ -11,5 +11,5 @@ export default new Vuex.Store({
   actions,
   getters,
   modules,
-  strict: true
+  strict: process.env.NODE_ENV !== 'production'
 })
diff --git a/template/package.json b/template/package.json
@@ -149,8 +149,8 @@
     "vue-loader": "^10.0.2",
     "vue-style-loader": "^1.0.0",
     "vue-template-compiler": "^2.1.10",
-    "webpack": "^2.2.0",
-    "webpack-dev-server": "^2.2.0"
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0"
   },
   "dependencies": {}
 }
diff --git a/template/test/unit/karma.conf.js b/template/test/unit/karma.conf.js
@@ -22,16 +22,16 @@ delete webpackConfig.externals
 delete webpackConfig.output.libraryTarget
 
 // only apply babel for test files when using isparta
-webpackConfig.module.rules.some(loader => {
-  if (loader.loader === 'babel-loader') {
-    loader.include.push(path.resolve(projectRoot, '../test/unit'))
+webpackConfig.module.rules.some(rule => {
+  if (rule.use === 'babel-loader') {
+    rule.include.push(path.resolve(projectRoot, '../test/unit'))
     return true
   }
 })
 
 // apply vue option to apply isparta-loader on js
 webpackConfig.module.rules
-  .find(({ loader }) => loader === 'vue-loader').options.loaders.js = 'babel-loader'
+  .find(rule => rule.use.loader === 'vue-loader').use.options.loaders.js = 'babel-loader'
 
 module.exports = config => {
   config.set({
diff --git a/template/webpack.renderer.config.js b/template/webpack.renderer.config.js
@@ -12,6 +12,7 @@ const HtmlWebpackPlugin = require('html-webpack-plugin')
 
 let rendererConfig = {
   devtool: '#eval-source-map',
+  devServer: { overlay: true },
   entry: {
     renderer: path.join(__dirname, 'app/src/renderer/main.js')
   },
@@ -20,53 +21,59 @@ let rendererConfig = {
     rules: [
       {
         test: /\.css$/,
-        loader: ExtractTextPlugin.extract({
-          fallbackLoader: 'style-loader',
-          loader: 'css-loader'
+        use: ExtractTextPlugin.extract({
+          fallback: 'style-loader',
+          use: 'css-loader'
         })
       },
       {
         test: /\.html$/,
-        loader: 'vue-html-loader'
+        use: 'vue-html-loader'
       },
       {
         test: /\.js$/,
-        loader: 'babel-loader',
+        use: 'babel-loader',
         include: [ path.resolve(__dirname, 'app/src/renderer') ],
         exclude: /node_modules/
       },
       {
         test: /\.json$/,
-        loader: 'json-loader'
+        use: 'json-loader'
       },
       {
         test: /\.node$/,
-        loader: 'node-loader'
+        use: 'node-loader'
       },
       {
         test: /\.vue$/,
-        loader: 'vue-loader',
-        options: {
-          loaders: {
-            sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax=1',
-            scss: 'vue-style-loader!css-loader!sass-loader'
+        use: {
+          loader: 'vue-loader',
+          options: {
+            loaders: {
+              sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax=1',
+              scss: 'vue-style-loader!css-loader!sass-loader'
+            }
           }
         }
       },
       {
         test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
-        loader: 'url-loader',
-        query: {
-          limit: 10000,
-          name: 'imgs/[name].[ext]'
+        use: {
+          loader: 'url-loader',
+          query: {
+            limit: 10000,
+            name: 'imgs/[name].[ext]'
+          }
         }
       },
       {
         test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
-        loader: 'url-loader',
-        query: {
-          limit: 10000,
-          name: 'fonts/[name].[ext]'
+        use: {
+          loader: 'url-loader',
+          query: {
+            limit: 10000,
+            name: 'fonts/[name].[ext]'
+          }
         }
       }
     ]
@@ -110,10 +117,14 @@ if (process.env.NODE_ENV !== 'production') {
     rendererConfig.module.rules.push(
       {
         test: /\.(js|vue)$/,
-        loader: 'eslint-loader',
         enforce: 'pre',
         exclude: /node_modules/,
-        options: { formatter: require('eslint-friendly-formatter') }
+        use: {
+          loader: 'eslint-loader',
+          options: {
+            formatter: require('eslint-friendly-formatter')
+          }
+        }
       }
     )
   }
