fix: Vue 2.7 compatibility

vuejs · Jun 16, 2022 · b454dda · b454dda
1 parent 58ff39c
commit b454dda
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 6 deletions.
diff --git a/packages/@vue/cli-plugin-typescript/index.js b/packages/@vue/cli-plugin-typescript/index.js
@@ -83,6 +83,20 @@ module.exports = (api, projectOptions) => {
     // this plugin does not play well with jest + cypress setup (tsPluginE2e.spec.js) somehow
     // so temporarily disabled for vue-cli tests
     if (!process.env.VUE_CLI_TEST) {
+      let compilerPath
+      try {
+        // Vue 2.7+
+        compilerPath = require.resolve('vue/compiler-sfc')
+      } catch (e) {
+        if (isVue3) {
+          // Vue 3.0.0-3.2.12
+          compilerPath = require.resolve('@vue/compiler-sfc')
+        } else {
+          // Vue <= 2.6
+          compilerPath = require.resolve('vue-template-compiler')
+        }
+      }
+
       if (isVue3) {
         config
           .plugin('fork-ts-checker')
@@ -91,7 +105,7 @@ module.exports = (api, projectOptions) => {
               extensions: {
                 vue: {
                   enabled: true,
-                  compiler: '@vue/compiler-sfc'
+                  compiler: compilerPath
                 }
               },
               diagnosticOptions: {
@@ -105,7 +119,7 @@ module.exports = (api, projectOptions) => {
         config
           .plugin('fork-ts-checker')
             .use(require('fork-ts-checker-webpack-plugin'), [{
-              vue: { enabled: true, compiler: 'vue-template-compiler' },
+              vue: { enabled: true, compiler: compilerPath },
               tslint: projectOptions.lintOnSave !== false && fs.existsSync(api.resolve('tslint.json')),
               formatter: 'codeframe',
               // https://github.com/TypeStrong/ts-loader#happypackmode-boolean-defaultfalse

diff --git a/packages/@vue/cli-plugin-typescript/package.json b/packages/@vue/cli-plugin-typescript/package.json
@@ -40,11 +40,16 @@
   "peerDependencies": {
     "@vue/cli-service": "^3.0.0 || ^4.0.0-0",
     "@vue/compiler-sfc": "^3.0.0-beta.14",
-    "typescript": ">=2"
+    "typescript": ">=2",
+    "vue": "*",
+    "vue-template-compiler": "^2.0.0"
   },
   "peerDependenciesMeta": {
     "@vue/compiler-sfc": {
       "optional": true
+    },
+    "vue-template-compiler": {
+      "optional": true
     }
   },
   "devDependencies": {

diff --git a/packages/@vue/cli-service/lib/config/base.js b/packages/@vue/cli-service/lib/config/base.js
@@ -83,11 +83,18 @@ module.exports = (api, options) => {
 
     if (vue && semver.major(vue.version) === 2) {
       // for Vue 2 projects
-      const vueLoaderCacheConfig = api.genCacheConfig('vue-loader', {
+      const partialIdentifier = {
         'vue-loader': require('vue-loader/package.json').version,
         '@vue/component-compiler-utils': require('@vue/component-compiler-utils/package.json').version,
-        'vue-template-compiler': require('vue-template-compiler/package.json').version
-      })
+      }
+
+      try {
+        partialIdentifier['vue-template-compiler'] = require('vue-template-compiler/package.json').version
+      } catch (e) {
+        // For Vue 2.7 projects, `vue-template-compiler` is not required
+      }
+
+      const vueLoaderCacheConfig = api.genCacheConfig('vue-loader', partialIdentifier)
 
       webpackConfig.resolve
         .alias