simplfy ts + babel, add generator test for ts

packages/@vue/cli-plugin-pwa/__tests__/pwaGenerator.spec.js

@@ -0,0 +1,26 @@
+const generateWithPlugin = require('@vue/cli-test-utils/generateWithPlugin')
+
+test('inject import statement for service worker', async () => {
+  const mockMain = (
+    `import Vue from 'vue'\n` +
+    `import Bar from './Bar.vue'`
+  )
+  const { files } = await generateWithPlugin([
+    {
+      id: 'files',
+      apply: api => {
+        api.render(files => {
+          files['src/main.js'] = mockMain
+        })
+      },
+      options: {}
+    },
+    {
+      id: 'pwa',
+      apply: require('../generator'),
+      options: {}
+    }
+  ])
+
+  expect(files['src/main.js']).toMatch(`${mockMain}\nimport './registerServiceWorker'`)
+})

packages/@vue/cli-plugin-typescript/__tests__/.eslintrc

@@ -0,0 +1,5 @@
+{
+  "rules": {
+    "vue-libs/no-async-functions": 0
+  }
+}

packages/@vue/cli-plugin-typescript/__tests__/tsGenerator.spec.js

@@ -0,0 +1,126 @@
+const generateWithPlugin = require('@vue/cli-test-utils/generateWithPlugin')
+
+test('generate files', async () => {
+  const { files } = await generateWithPlugin([
+    {
+      id: 'core',
+      apply: require('@vue/cli-service/generator'),
+      options: {}
+    },
+    {
+      id: 'ts',
+      apply: require('../generator'),
+      options: {}
+    }
+  ])
+
+  expect(files['src/main.ts']).toBeTruthy()
+  expect(files['src/main.js']).toBeFalsy()
+  expect(files['src/App.vue']).toMatch('<script lang="ts">')
+})
+
+test('classComponent', async () => {
+  const { pkg, files } = await generateWithPlugin([
+    {
+      id: 'ts',
+      apply: require('../generator'),
+      options: {
+        classComponent: true
+      }
+    }
+  ])
+
+  expect(pkg.devDependencies).toHaveProperty('vue-class-component')
+  expect(pkg.devDependencies).toHaveProperty('vue-property-decorator')
+
+  expect(files['tsconfig.json']).toMatch(`"experimentalDecorators": true`)
+  expect(files['tsconfig.json']).toMatch(`"emitDecoratorMetadata": true`)
+  expect(files['src/App.vue']).toMatch(`export default class App extends Vue {`)
+  expect(files['src/components/HelloWorld.vue']).toMatch(`export default class HelloWorld extends Vue {`)
+})
+
+test('use with Babel', async () => {
+  const { pkg, files } = await generateWithPlugin([
+    {
+      id: 'babel',
+      apply: require('@vue/cli-plugin-babel/generator'),
+      options: {}
+    },
+    {
+      id: 'ts',
+      apply: require('../generator'),
+      options: {
+        useTsWithBabel: true
+      }
+    }
+  ])
+
+  expect(pkg.devDependencies).toHaveProperty('@vue/babel-preset-app')
+  expect(pkg.babel).toEqual({ presets: ['@vue/app'] })
+  expect(files['tsconfig.json']).toMatch(`"target": "es2015"`)
+})
+
+test('lint', async () => {
+  const { pkg, files } = await generateWithPlugin([
+    {
+      id: 'ts',
+      apply: require('../generator'),
+      options: {
+        lint: true,
+        lintOn: ['save', 'commit']
+      }
+    }
+  ])
+
+  expect(pkg.scripts.lint).toBe(`vue-cli-service lint`)
+  expect(pkg.vue).toEqual({ lintOnSave: true })
+  expect(pkg.devDependencies).toHaveProperty('lint-staged')
+  expect(pkg.gitHooks).toEqual({ 'pre-commit': 'lint-staged' })
+  expect(pkg['lint-staged']).toEqual({
+    '*.ts': ['vue-cli-service lint', 'git add'],
+    '*.vue': ['vue-cli-service lint', 'git add']
+  })
+
+  expect(files['tslint.json']).toBeTruthy()
+})
+
+test('compat with unit-mocha', async () => {
+  const { pkg } = await generateWithPlugin([
+    {
+      id: '@vue/cli-plugin-unit-mocha',
+      apply: () => {},
+      options: {}
+    },
+    {
+      id: 'ts',
+      apply: require('../generator'),
+      options: {
+        lint: true,
+        lintOn: ['save', 'commit']
+      }
+    }
+  ])
+
+  expect(pkg.devDependencies).toHaveProperty('@types/mocha')
+  expect(pkg.devDependencies).toHaveProperty('@types/chai')
+})
+
+test('compat with unit-jest', async () => {
+  const { pkg } = await generateWithPlugin([
+    {
+      id: '@vue/cli-plugin-unit-jest',
+      apply: () => {},
+      options: {}
+    },
+    {
+      id: 'ts',
+      apply: require('../generator'),
+      options: {
+        lint: true,
+        lintOn: ['save', 'commit']
+      }
+    }
+  ])
+
+  expect(pkg.devDependencies).toHaveProperty('@types/jest')
+})

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

@@ -14,27 +14,10 @@ module.exports = (api, {
     })
   }
 
-  if (useTsWithBabel) {
+  if (experimentalCompileTsWithBabel) {
     api.extendPackage({
       devDependencies: {
-        'babel-loader': '8 || ^8.0.0-beta || ^8.0.0-rc',
-        '@babel/core': '7 || ^7.0.0-beta || ^7.0.0-rc',
-        '@vue/babel-preset-app': '^3.0.0-alpha.1'
-      },
-      vue: {
-        useTsWithBabel: true
-      },
-      babel: {
-        presets: ['@vue/app']
-      }
-    })
-  } else if (experimentalCompileTsWithBabel) {
-    api.extendPackage({
-      devDependencies: {
-        'babel-loader': '8 || ^8.0.0-beta || ^8.0.0-rc',
-        '@babel/core': '7 || ^7.0.0-beta || ^7.0.0-rc',
-        '@babel/preset-typescript': '7 || ^7.0.0-beta || ^7.0.0-rc',
-        '@vue/babel-preset-app': '^3.0.0-alpha.1'
+        '@babel/preset-typescript': '7 || ^7.0.0-beta || ^7.0.0-rc'
       },
       vue: {
         experimentalCompileTsWithBabel: true
@@ -79,7 +62,7 @@ module.exports = (api, {
           'pre-commit': 'lint-staged'
         },
         'lint-staged': {
-          '*.js': ['vue-cli-service lint', 'git add'],
+          '*.ts': ['vue-cli-service lint', 'git add'],
           '*.vue': ['vue-cli-service lint', 'git add']
         }
       })
@@ -93,7 +76,7 @@ module.exports = (api, {
 
   // inject necessary typings for other plugins
 
-  const hasMocha = api.hasPlugin('@vue/cli-plugin-unit-mocha')
+  const hasMocha = api.hasPlugin('unit-mocha')
   if (hasMocha) {
     api.extendPackage({
       devDependencies: {
@@ -103,7 +86,7 @@ module.exports = (api, {
     })
   }
 
-  const hasJest = api.hasPlugin('@vue/cli-plugin-unit-jest')
+  const hasJest = api.hasPlugin('unit-jest')
   if (hasJest) {
     api.extendPackage({
       devDependencies: {

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

@@ -32,7 +32,7 @@ module.exports = (api, options) => {
               return options
             })
     } else {
-      if (options.useTsWithBabel) {
+      if (api.hasPlugin('babel')) {
         tsRule
           .use('babel-loader')
             .loader('babel-loader')

packages/@vue/cli-plugin-typescript/lib/tslint.js

@@ -81,6 +81,8 @@ module.exports = function lint (args = {}, api, silent) {
   return globby(files).then(files => {
     return Promise.all(files.map(lint))
   }).then(() => {
+    if (silent) return
+
     const result = linter.getResult()
     if (result.output.trim()) {
       process.stdout.write(stripTsExtension(result.output))

packages/@vue/cli/lib/promptModules/babel.js

@@ -1,6 +1,10 @@
 module.exports = cli => {
   cli.onPromptComplete((answers, options) => {
-    if (!answers.features.includes('ts')) {
+    if (
+      !answers.features.includes('ts') ||
+      answers.useTsWithBabel ||
+      answers.experimentalCompileTsWithBabel
+    ) {
       options.plugins['@vue/cli-plugin-babel'] = {}
     }
   })