fix: vue-template-compiler can be optional if @vue/compiler-sfc presents (#5123)

Author: haoqunjiang

packages/@vue/cli-service/lib/config/base.js

@@ -73,12 +73,21 @@ module.exports = (api, options) => {
     // js is handled by cli-plugin-babel ---------------------------------------
 
     // vue-loader --------------------------------------------------------------
-    const vueLoaderCacheConfig = api.genCacheConfig('vue-loader', {
-      'vue-loader': require('vue-loader/package.json').version,
-      /* eslint-disable-next-line node/no-extraneous-require */
-      '@vue/component-compiler-utils': require('@vue/component-compiler-utils/package.json').version,
-      'vue-template-compiler': require('vue-template-compiler/package.json').version
-    })
+    const vueLoaderCacheIdentifier = {
+      'vue-loader': require('vue-loader/package.json').version
+    }
+
+    // The following 2 deps are sure to exist in Vue 2 projects.
+    // But once we switch to Vue 3, they're no longer mandatory.
+    // (In Vue 3 they are replaced by @vue/compiler-sfc)
+    // So wrap them in a try catch block.
+    try {
+      vueLoaderCacheIdentifier['@vue/component-compiler-utils'] =
+        require('@vue/component-compiler-utils/package.json').version
+      vueLoaderCacheIdentifier['vue-template-compiler'] =
+        require('vue-template-compiler/package.json').version
+    } catch (e) {}
+    const vueLoaderCacheConfig = api.genCacheConfig('vue-loader', vueLoaderCacheIdentifier)
 
     webpackConfig.module
       .rule('vue')

packages/@vue/cli-service/package.json

@@ -94,6 +94,9 @@
     },
     "stylus-loader": {
       "optional": true
+    },
+    "vue-template-compiler": {
+      "optional": true
     }
   },
   "devDependencies": {