feat: Support vue.config.ts

babel.config.js

@@ -0,0 +1,15 @@
+// jest/babel-jest use babel to supports TypeScript
+// esbuild-register will not work
+module.exports = {
+  presets: [
+    [
+      '@babel/preset-env',
+      {
+        targets: {
+          node: 'current'
+        }
+      }
+    ],
+    '@babel/preset-typescript'
+  ]
+}

jest.config.js

@@ -1,9 +1,9 @@
 module.exports = {
-  'testEnvironment': 'node',
-  'setupFiles': [
-    '<rootDir>/scripts/testSetup.js'
-  ],
-  'testMatch': [
-    '**/__tests__/**/*.spec.js'
-  ]
+  transform: {
+    '^.+\\.[j|t]sx?$': 'babel-jest',
+    '^.+\\.mjs$': 'babel-jest'
+  },
+  testEnvironment: 'node',
+  setupFiles: ['<rootDir>/scripts/testSetup.js'],
+  testMatch: ['**/__tests__/**/*.spec.js']
 }

packages/@vue/cli-service/__tests__/ServiceESM.spec.js

@@ -62,3 +62,14 @@ test('load project options from vue.config.mjs', async () => {
   expect(service.projectOptions.lintOnSave).toBe(true)
   await fs.unlinkSync(configPath)
 })
+
+test('load project options from vue.config.ts', async () => {
+  const configPath = path.resolve(project.dir, './vue.config.ts')
+  fs.writeFileSync(configPath, `
+  const lintOnSave:boolean = true
+  export default { lintOnSave }
+  `)
+  const service = await createService()
+  expect(service.projectOptions.lintOnSave).toBe(true)
+  await fs.unlinkSync(configPath)
+})

packages/@vue/cli-service/lib/util/loadFileConfig.js

@@ -1,34 +1,30 @@
-const fs = require('fs')
-const path = require('path')
+// @ts-check
+const { existsSync } = require('fs')
+const { join } = require('path')
+const { register } = require('esbuild-register/dist/node')
 
-const isFileEsm = require('is-file-esm')
-const { loadModule } = require('@vue/cli-shared-utils')
+const POSSIBLE_CONFIG_PATHS = [
+  process.env.VUE_CLI_SERVICE_CONFIG_PATH,
+  'vue.config.js',
+  'vue.config.cjs',
+  'vue.config.mjs',
+  'vue.config.ts'
+].filter(i => !!i)
 
 module.exports = function loadFileConfig (context) {
-  let fileConfig, fileConfigPath
+  let fileConfig
 
-  const possibleConfigPaths = [
-    process.env.VUE_CLI_SERVICE_CONFIG_PATH,
-    './vue.config.js',
-    './vue.config.cjs',
-    './vue.config.mjs'
-  ]
-  for (const p of possibleConfigPaths) {
-    const resolvedPath = p && path.resolve(context, p)
-    if (resolvedPath && fs.existsSync(resolvedPath)) {
-      fileConfigPath = resolvedPath
-      break
-    }
-  }
+  const formatPath = p => join(context, p)
+  const fileConfigPath = POSSIBLE_CONFIG_PATHS.map(formatPath).find(p => existsSync(p))
+  const compatESModuleRequire = m => m.__esModule ? m.default : m
 
   if (fileConfigPath) {
-    const { esm } = isFileEsm.sync(fileConfigPath)
-
-    if (esm) {
-      fileConfig = import(fileConfigPath)
-    } else {
-      fileConfig = loadModule(fileConfigPath, context)
-    }
+    // Use esbuild to compile conifg files
+    register({
+      target: 'es2017',
+      format: 'cjs'
+    })
+    fileConfig = compatESModuleRequire(require(fileConfigPath))
   }
 
   return {

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

@@ -53,11 +53,12 @@
     "default-gateway": "^6.0.3",
     "dotenv": "^10.0.0",
     "dotenv-expand": "^5.1.0",
+    "esbuild": "0.13.12",
+    "esbuild-register": "3.0.0",
     "fs-extra": "^9.1.0",
     "globby": "^11.0.2",
     "hash-sum": "^2.0.0",
     "html-webpack-plugin": "^5.1.0",
-    "is-file-esm": "^1.0.0",
     "launch-editor-middleware": "^2.2.1",
     "lodash.defaultsdeep": "^4.6.1",
     "lodash.mapvalues": "^4.6.0",