perf: vastly improve rebuild perf with caching

vuejs · May 22, 2018 · dfdc00c · dfdc00c
1 parent aaf3aef
commit dfdc00c
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 27 deletions.
diff --git a/lib/webpack/createBaseConfig.js b/lib/webpack/createBaseConfig.js
@@ -67,16 +67,55 @@ module.exports = function createBaseConfig ({
   config.module
     .noParse(/^(vue|vue-router|vuex|vuex-router-sync)$/)
 
-  config.module
-    .rule('vue')
-      .test(/\.vue$/)
+  const cacheDirectory = path.resolve(__dirname, '../../node_modules/.cache/vuepress')
+  const cacheIdentifier = JSON.stringify({
+    vuepress: require('../../package.json').version,
+    'cache-loader': require('cache-loader').version,
+    'vue-loader': require('vue-loader').version,
+    env: process.env.NODE_ENV,
+    config: (
+      (siteConfig.chainWebpack || '').toString() +
+      (siteConfig.configureWebpack || '').toString()
+    )
+  })
+
+  function applyVuePipeline (rule) {
+    rule
+      .use('cache-loader')
+        .loader('cache-loader')
+        .options({
+          cacheDirectory,
+          cacheIdentifier
+        })
+
+    rule
       .use('vue-loader')
         .loader('vue-loader')
         .options({
           compilerOptions: {
             preserveWhitespace: false
-          }
+          },
+          cacheDirectory,
+          cacheIdentifier
         })
+  }
+
+  const vueRule = config.module
+    .rule('vue')
+      .test(/\.vue$/)
+
+  applyVuePipeline(vueRule)
+
+  const mdRule = config.module
+    .rule('markdown')
+      .test(/\.md$/)
+
+  applyVuePipeline(mdRule)
+
+  mdRule
+    .use('markdown-loader')
+      .loader(require.resolve('./markdownLoader'))
+      .options({ sourceDir, markdown })
 
   config.module
     .rule('pug')
@@ -102,6 +141,13 @@ module.exports = function createBaseConfig ({
           // Don't transpile node_modules
           return /node_modules/.test(filepath)
         }).end()
+        .use('cache-loader')
+          .loader('cache-loader')
+          .options({
+            cacheDirectory,
+            cacheIdentifier
+          })
+          .end()
         .use('babel-loader')
           .loader('babel-loader')
           .options({
@@ -116,24 +162,6 @@ module.exports = function createBaseConfig ({
           })
   }
 
-  config.module
-    .rule('markdown')
-      .test(/\.md$/)
-      .use('vue-loader')
-        .loader('vue-loader')
-        .options({
-          compilerOptions: {
-            preserveWhitespace: false
-          }
-        })
-        .end()
-      .use('markdown-loader')
-        .loader(require.resolve('./markdownLoader'))
-        .options({
-          sourceDir,
-          markdown
-        })
-
   config.module
     .rule('images')
       .test(/\.(png|jpe?g|gif)(\?.*)?$/)

diff --git a/package.json b/package.json
@@ -46,6 +46,7 @@
     "babel-plugin-transform-vue-jsx": "^3.7.0",
     "babel-preset-env": "^1.6.1",
     "babel-preset-stage-2": "^6.24.1",
+    "cache-loader": "^1.2.2",
     "chalk": "^2.3.2",
     "chokidar": "^2.0.3",
     "commander": "^2.15.1",
@@ -87,7 +88,7 @@
     "toml": "^2.3.3",
     "url-loader": "^1.0.1",
     "vue": "^2.5.16",
-    "vue-loader": "^15.0.4",
+    "vue-loader": "^15.2.0",
     "vue-router": "^3.0.1",
     "vue-server-renderer": "^2.5.16",
     "vue-template-compiler": "^2.5.16",

diff --git a/yarn.lock b/yarn.lock
@@ -1400,6 +1400,15 @@ cache-base@^1.0.1:
     union-value "^1.0.0"
     unset-value "^1.0.0"
 
+cache-loader@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/cache-loader/-/cache-loader-1.2.2.tgz#6d5c38ded959a09cc5d58190ab5af6f73bd353f5"
+  dependencies:
+    loader-utils "^1.1.0"
+    mkdirp "^0.5.1"
+    neo-async "^2.5.0"
+    schema-utils "^0.4.2"
+
 call-me-maybe@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/call-me-maybe/-/call-me-maybe-1.0.1.tgz#26d208ea89e37b5cbde60250a15f031c16a4d66b"
@@ -6325,7 +6334,7 @@ sax@^1.2.4, sax@~1.2.1:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
 
-schema-utils@^0.4.0, schema-utils@^0.4.3, schema-utils@^0.4.4, schema-utils@^0.4.5:
+schema-utils@^0.4.0, schema-utils@^0.4.2, schema-utils@^0.4.3, schema-utils@^0.4.4, schema-utils@^0.4.5:
   version "0.4.5"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.4.5.tgz#21836f0608aac17b78f9e3e24daff14a5ca13a3e"
   dependencies:
@@ -7254,9 +7263,9 @@ vue-hot-reload-api@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.0.tgz#97976142405d13d8efae154749e88c4e358cf926"
 
-vue-loader@^15.0.4:
-  version "15.0.11"
-  resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-15.0.11.tgz#b41dee864cdeb0012c8a2c02a66b13459e45e16e"
+vue-loader@^15.2.0:
+  version "15.2.0"
+  resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-15.2.0.tgz#5a8138e490a1040942d2f10ae68fa72b5a923364"
   dependencies:
     "@vue/component-compiler-utils" "^1.2.1"
     hash-sum "^1.0.2"