Improve invocation of builtin plugins in TypeScript projects

packages/@vue/cli-plugin-pwa/generator/index.js

@@ -4,6 +4,11 @@ module.exports = api => {
  'register-service-worker': '^1.0.0'
  }
  })
- api.injectImports(`src/main.js`, `import './registerServiceWorker'`)
+ api.injectImports(api.entryFile, `import './registerServiceWorker'`)
  api.render('./template')
+
+ if (api.invoking && api.hasPlugin('typescript')) {
+ const convertFiles = require('@vue/cli-plugin-typescript/generator/convert')
+ convertFiles(api)
+ }
 }

packages/@vue/cli-plugin-typescript/generator/convert.js

@@ -0,0 +1,22 @@
+module.exports = (api, { tsLint = false } = {}) => {
+ // delete all js files that have a ts file of the same name
+ // and simply rename other js files to ts
+ const jsRE = /\.js$/
+ const excludeRE = /^tests\/e2e\/|(\.config|rc)\.js$/
+ const convertLintFlags = require('../lib/convertLintFlags')
+ api.postProcessFiles(files => {
+ for (const file in files) {
+ if (jsRE.test(file) && !excludeRE.test(file)) {
+ const tsFile = file.replace(jsRE, '.ts')
+ if (!files[tsFile]) {
+ let content = files[file]
+ if (tsLint) {
+ content = convertLintFlags(content)
+ }
+ files[tsFile] = content
+ }
+ delete files[file]
+ }
+ }
+ })
+}

packages/@vue/cli-plugin-typescript/generator/index.js

@@ -79,24 +79,5 @@ module.exports = (api, {
  hasJest
  })
 
- // delete all js files that have a ts file of the same name
- // and simply rename other js files to ts
- const jsRE = /\.js$/
- const excludeRE = /^tests\/e2e\/|(\.config|rc)\.js$/
- const convertLintFlags = require('../lib/convertLintFlags')
- api.postProcessFiles(files => {
- for (const file in files) {
- if (jsRE.test(file) && !excludeRE.test(file)) {
- const tsFile = file.replace(jsRE, '.ts')
- if (!files[tsFile]) {
- let content = files[file]
- if (tsLint) {
- content = convertLintFlags(content)
- }
- files[tsFile] = content
- }
- delete files[file]
- }
- }
- })
+ require('./convert')(api, { tsLint })
 }

packages/@vue/cli-service/generator/router/index.js

@@ -1,14 +1,14 @@
 module.exports = (api, options) => {
- api.injectImports(`src/main.js`, `import router from './router'`)
- api.injectRootOptions(`src/main.js`, `router`)
+ api.injectImports(api.entryFile, `import router from './router'`)
+ api.injectRootOptions(api.entryFile, `router`)
  api.extendPackage({
  dependencies: {
  'vue-router': '^3.0.1'
  }
  })
  api.render('./template')
 
- if (options.invoking) {
+ if (api.invoking) {
  api.postProcessFiles(files => {
  const appFile = files[`src/App.vue`]
  if (appFile) {
@@ -26,5 +26,10 @@ module.exports = (api, options) => {
  console.log(files[`src/App.vue`])
  }
  })
+
+ if (api.hasPlugin('typescript')) {
+ const convertFiles = require('@vue/cli-plugin-typescript/generator/convert')
+ convertFiles(api)
+ }
  }
 }

packages/@vue/cli-service/generator/vuex/index.js

@@ -1,10 +1,15 @@
 module.exports = (api, options) => {
- api.injectImports(`src/main.js`, `import store from './store'`)
- api.injectRootOptions(`src/main.js`, `store`)
+ api.injectImports(api.entryFile, `import store from './store'`)
+ api.injectRootOptions(api.entryFile, `store`)
  api.extendPackage({
  dependencies: {
  vuex: '^3.0.1'
  }
  })
  api.render('./template')
+
+ if (api.invoking && api.hasPlugin('typescript')) {
+ const convertFiles = require('@vue/cli-plugin-typescript/generator/convert')
+ convertFiles(api)
+ }
 }

packages/@vue/cli/lib/Generator.js

@@ -22,7 +22,8 @@ module.exports = class Generator {
  pkg = {},
  plugins = [],
  completeCbs = [],
- files = {}
+ files = {},
+ invoking = false
  } = {}) {
  this.context = context
  this.plugins = plugins
@@ -31,6 +32,7 @@ module.exports = class Generator {
  this.imports = {}
  this.rootOptions = {}
  this.completeCbs = completeCbs
+ this.invoking = invoking
 
  // for conflict resolution
  this.depSources = {}

packages/@vue/cli/lib/GeneratorAPI.js

@@ -33,6 +33,8 @@ class GeneratorAPI {
  name: toShortPluginId(id),
  link: getPluginLink(id)
  }))
+
+ this._entryFile = undefined
  }
 
  /**
@@ -225,6 +227,25 @@ class GeneratorAPI {
  _options.add(opt)
  })
  }
+
+ /**
+ * Get the entry file taking into account typescript.
+ *
+ * @readonly
+ */
+ get entryFile () {
+ if (this._entryFile) return this._entryFile
+ return (this._entryFile = fs.existsSync(this.resolve('src/main.ts')) ? 'src/main.ts' : 'src/main.js')
+ }
+
+ /**
+ * Is the plugin being invoked?
+ *
+ * @readonly
+ */
+ get invoking () {
+ return this.generator.invoking
+ }
 }
 
 function extractCallDir () {

packages/@vue/cli/lib/add.js

@@ -46,16 +46,14 @@ async function add (pluginName, options = {}, context = process.cwd()) {
 async function addRouter (context) {
  invoke.runGenerator(context, {
  id: 'core:router',
- apply: require('@vue/cli-service/generator/router'),
- options: { invoking: true }
+ apply: require('@vue/cli-service/generator/router')
  })
 }
 
 async function addVuex (context) {
  invoke.runGenerator(context, {
  id: 'core:vuex',
- apply: require('@vue/cli-service/generator/vuex'),
- options: { invoking: true }
+ apply: require('@vue/cli-service/generator/vuex')
  })
 }
 

packages/@vue/cli/lib/invoke.js

@@ -100,7 +100,8 @@ async function runGenerator (context, plugin, pkg = getPkg(context)) {
  pkg,
  plugins: [plugin],
  files: await readFiles(context),
- completeCbs: createCompleteCbs
+ completeCbs: createCompleteCbs,
+ invoking: true
  })
 
  log()