fix #251, close #247, #216, #209 (#253)

* 1. fix issue related to `route-cache`
2. use `this.$route` directly in component method
3. bump dependencies

* use webpack ModuleConcatenationPlugin on production

* use req.originalUrl as cacheKey

build/webpack.base.config.js

@@ -61,6 +61,7 @@ module.exports = {
         new webpack.optimize.UglifyJsPlugin({
           compress: { warnings: false }
         }),
+        new webpack.optimize.ModuleConcatenationPlugin(),
         new ExtractTextPlugin({
           filename: 'common.[chunkhash].css'
         })

package.json

@@ -15,43 +15,43 @@
     "npm": ">=4.0"
   },
   "dependencies": {
-    "compression": "^1.6.2",
-    "cross-env": "^4.0.0",
-    "es6-promise": "^4.1.0",
-    "express": "^4.15.2",
-    "extract-text-webpack-plugin": "^2.1.0",
-    "firebase": "^3.7.2",
-    "lru-cache": "^4.0.2",
-    "route-cache": "0.4.2",
-    "serve-favicon": "^2.4.1",
-    "vue": "^2.4.1",
+    "compression": "^1.7.0",
+    "cross-env": "^5.0.5",
+    "es6-promise": "^4.1.1",
+    "express": "^4.15.4",
+    "extract-text-webpack-plugin": "^3.0.0",
+    "firebase": "^4.3.1",
+    "lru-cache": "^4.1.1",
+    "route-cache": "0.4.3",
+    "serve-favicon": "^2.4.4",
+    "vue": "^2.4.4",
     "vue-router": "^2.7.0",
-    "vue-server-renderer": "^2.4.1",
-    "vuex": "^2.3.1",
-    "vuex-router-sync": "^4.1.2"
+    "vue-server-renderer": "^2.4.4",
+    "vuex": "^2.4.0",
+    "vuex-router-sync": "^4.3.1"
   },
   "devDependencies": {
-    "autoprefixer": "^6.7.7",
-    "babel-core": "^6.24.1",
-    "babel-loader": "^7.1.1",
+    "autoprefixer": "^7.1.4",
+    "babel-core": "^6.26.0",
+    "babel-loader": "^7.1.2",
     "babel-plugin-syntax-dynamic-import": "^6.18.0",
-    "babel-preset-env": "^1.4.0",
-    "css-loader": "^0.28.0",
-    "file-loader": "^0.11.1",
+    "babel-preset-env": "^1.6.0",
+    "css-loader": "^0.28.7",
+    "file-loader": "^0.11.2",
     "friendly-errors-webpack-plugin": "^1.6.1",
-    "glob": "^7.1.1",
-    "rimraf": "^2.6.1",
+    "glob": "^7.1.2",
+    "rimraf": "^2.6.2",
     "stylus": "^0.54.5",
     "stylus-loader": "^3.0.1",
-    "sw-precache-webpack-plugin": "^0.10.1",
-    "url-loader": "^0.5.8",
-    "vue-loader": "^13.0.1",
-    "vue-style-loader": "^3.0.0",
-    "vue-template-compiler": "^2.4.1",
-    "webpack": "^3.2.0",
-    "webpack-dev-middleware": "^1.10.1",
-    "webpack-hot-middleware": "^2.17.1",
+    "sw-precache-webpack-plugin": "^0.11.4",
+    "url-loader": "^0.5.9",
+    "vue-loader": "^13.0.4",
+    "vue-style-loader": "^3.0.3",
+    "vue-template-compiler": "^2.4.4",
+    "webpack": "^3.6.0",
+    "webpack-dev-middleware": "^1.12.0",
+    "webpack-hot-middleware": "^2.19.1",
     "webpack-merge": "^4.0.0",
-    "webpack-node-externals": "^1.5.4"
+    "webpack-node-externals": "^1.6.0"
   }
 }

server.js

@@ -72,7 +72,7 @@ app.use('/service-worker.js', serve('./dist/service-worker.js'))
 // headers.
 // 1-second microcache.
 // https://www.nginx.com/blog/benefits-of-microcaching-nginx/
-app.use(microcache.cacheSeconds(1, () => useMicroCache))
+app.use(microcache.cacheSeconds(1, req => useMicroCache && req.originalUrl))
 
 function render (req, res) {
   const s = Date.now()

src/entry-server.js

@@ -13,7 +13,7 @@ export default context => {
     const { app, router, store } = createApp()
 
     const { url } = context
-    const fullPath = router.resolve(url).route.fullPath
+    const { fullPath } = router.resolve(url).route
 
     if (fullPath !== url) {
       reject({ url: fullPath })

src/views/ItemList.vue

@@ -36,14 +36,14 @@ export default {
   data () {
     return {
       transition: 'slide-right',
-      displayedPage: Number(this.$store.state.route.params.page) || 1,
+      displayedPage: Number(this.$route.params.page) || 1,
       displayedItems: this.$store.getters.activeItems
     }
   },
 
   computed: {
     page () {
-      return Number(this.$store.state.route.params.page) || 1
+      return Number(this.$route.params.page) || 1
     },
     maxPage () {
       const { itemsPerPage, lists } = this.$store.state