Merge branch 'dev' of github.com:vuejs/vue-cli into dev

Author: Guillaume Chau

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

@@ -1,4 +1,4 @@
-jest.setTimeout(10000)
+jest.setTimeout(30000)
 
 const create = require('@vue/cli-test-utils/createTestProject')
 

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

@@ -4,93 +4,117 @@ module.exports = function lint (args = {}, api, silent) {
   const path = require('path')
   const globby = require('globby')
   const tslint = require('tslint')
+  const ts = require('typescript')
   /* eslint-disable-next-line node/no-extraneous-require */
   const vueCompiler = require('vue-template-compiler')
+  const isVueFile = file => /\.vue(\.ts)?$/.test(file)
 
   const options = {
     fix: args['fix'] !== false,
     formatter: args.format || 'codeFrame',
     formattersDirectory: args['formatters-dir'],
     rulesDirectory: args['rules-dir']
   }
-  const linter = new tslint.Linter(options)
 
-  const config = tslint.Configuration.findConfiguration(api.resolve('tslint.json')).results
-  // create a patched config that disables the blank lines rule,
-  // so that we get correct line numbers in error reports for *.vue files.
-  const vueConfig = Object.assign(config)
-  const rules = vueConfig.rules = new Map(vueConfig.rules)
-  const rule = rules.get('no-consecutive-blank-lines')
-  rules.set('no-consecutive-blank-lines', Object.assign({}, rule, {
-    ruleSeverity: 'off'
-  }))
-
-  // hack to make tslint --fix work for *.vue files
-  // this works because (luckily) tslint lints synchronously
+  // hack to make tslint --fix work for *.vue files:
+  // we save the non-script parts to a cache right before
+  // linting the file, and patch fs.writeFileSync to combine the fixed script
+  // back with the non-script parts.
+  // this works because (luckily) tslint lints synchronously.
   const vueFileCache = new Map()
   const writeFileSync = fs.writeFileSync
+
   const patchWriteFile = () => {
     fs.writeFileSync = (file, content, options) => {
-      if (/\.vue(\.ts)?$/.test(file)) {
-        file = file.replace(/\.ts$/, '')
+      if (isVueFile(file)) {
         const { before, after } = vueFileCache.get(path.normalize(file))
         content = `${before}\n${content.trim()}\n${after}`
       }
       return writeFileSync(file, content, options)
     }
   }
+
   const restoreWriteFile = () => {
     fs.writeFileSync = writeFileSync
   }
 
-  const lint = file => new Promise((resolve, reject) => {
-    const filePath = api.resolve(file)
-    fs.readFile(filePath, 'utf-8', (err, content) => {
-      if (err) return reject(err)
-      const isVue = /\.vue(\.ts)?$/.test(file)
-      if (isVue) {
-        const { script } = vueCompiler.parseComponent(content, { pad: 'line' })
-        if (script) {
-          vueFileCache.set(filePath, {
-            before: content.slice(0, script.start),
-            after: content.slice(script.end)
-          })
-        }
-        content = script && script.content
-      }
-      if (content) {
-        patchWriteFile()
-        linter.lint(
-          // append .ts so that tslint apply TS rules
-          `${filePath}${isVue ? `.ts` : ``}`,
-          content,
-          // use Vue config to ignore blank lines
-          isVue ? vueConfig : config
-        )
-        restoreWriteFile()
+  const parseTSFromVueFile = file => {
+    const content = fs.readFileSync(file, 'utf-8')
+    const { script } = vueCompiler.parseComponent(content, { pad: 'line' })
+    if (script) {
+      vueFileCache.set(file, {
+        before: content.slice(0, script.start),
+        after: content.slice(script.end)
+      })
+    }
+    return script && script.content
+  }
+
+  const program = tslint.Linter.createProgram(api.resolve('tsconfig.json'))
+
+  // patch getSourceFile for *.vue files
+  // so that it returns the <script> block only
+  const patchProgram = program => {
+    const getSourceFile = program.getSourceFile
+    program.getSourceFile = function (file, languageVersion, onError) {
+      if (isVueFile(file)) {
+        const script = parseTSFromVueFile(file)
+        return ts.createSourceFile(file, script, languageVersion, true)
+      } else {
+        return getSourceFile.call(this, file, languageVersion, onError)
       }
-      resolve()
-    })
-  })
+    }
+  }
+
+  patchProgram(program)
+
+  const linter = new tslint.Linter(options, program)
+
+  // patch linter.updateProgram to ensure every program has correct getSourceFile
+  const updateProgram = linter.updateProgram
+  linter.updateProgram = function (...args) {
+    updateProgram.call(this, ...args)
+    patchProgram(this.program)
+  }
+
+  const config = tslint.Configuration.findConfiguration(api.resolve('tslint.json')).results
+  // create a patched config that disables the blank lines rule,
+  // so that we get correct line numbers in error reports for *.vue files.
+  const vueConfig = Object.assign(config)
+  const rules = vueConfig.rules = new Map(vueConfig.rules)
+  const rule = rules.get('no-consecutive-blank-lines')
+  rules.set('no-consecutive-blank-lines', Object.assign({}, rule, {
+    ruleSeverity: 'off'
+  }))
+
+  const lint = file => {
+    const filePath = api.resolve(file)
+    const isVue = isVueFile(file)
+    patchWriteFile()
+    linter.lint(
+      // append .ts so that tslint apply TS rules
+      filePath,
+      '',
+      // use Vue config to ignore blank lines
+      isVue ? vueConfig : config
+    )
+    restoreWriteFile()
+  }
 
   const files = args._ && args._.length
     ? args._
     : ['src/**/*.ts', 'src/**/*.vue', 'src/**/*.tsx', 'tests/**/*.ts', 'tests/**/*.tsx']
 
-  const stripTsExtension = str => str.replace(/\.vue\.ts\b/g, '.vue')
-
   return globby(files, { cwd }).then(files => {
-    return Promise.all(files.map(lint))
-  }).then(() => {
+    files.forEach(lint)
     if (silent) return
-
     const result = linter.getResult()
     if (result.output.trim()) {
-      process.stdout.write(stripTsExtension(result.output))
+      process.stdout.write(result.output)
     } else if (result.fixes.length) {
       // some formatters do not report fixes.
       const f = new tslint.Formatters.ProseFormatter()
-      process.stdout.write(stripTsExtension(f.format(result.failures, result.fixes)))
+      process.stdout.write(f.format(result.failures, result.fixes))
     } else if (!result.failures.length) {
       console.log(`No lint errors found.\n`)
     }

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

@@ -88,3 +88,43 @@ test('build as lib (js)', async () => {
     return window.testLib.bar
   })).toBe(2)
 })
+
+test('build as lib with webpackConfiguration depending on target (js)', async () => {
+  const project = await create('build-lib-js-webpack-target', defaultPreset)
+  await project.write('src/a-library.js', `
+    export default {
+      foo: 'bar'
+    }
+  `)
+
+  await project.write('src/main.js', `
+    export * from 'a-library'
+  `)
+
+  await project.write('vue.config.js', `
+    const path = require('path')
+    module.exports = {
+      configureWebpack: config => {
+        config.resolve.alias['a-library'] = path.resolve(__dirname, 'src', 'a-library.js')
+
+        if (config.output.libraryTarget === 'umd') {
+          return
+        }
+
+        config.externals = ['a-library']
+      }
+    }
+  `)
+
+  const { stdout } = await project.run('vue-cli-service build --target lib --name testLib src/main.js')
+  expect(stdout).toMatch('Build complete.')
+
+  expect(project.has('dist/testLib.umd.js')).toBe(true)
+  expect(project.has('dist/testLib.common.js')).toBe(true)
+
+  const umdContent = await project.read('dist/testLib.umd.js')
+  expect(umdContent).toContain(`foo: 'bar'`)
+
+  const commonContent = await project.read('dist/testLib.common.js')
+  expect(commonContent).not.toContain(`foo: 'bar'`)
+})

packages/@vue/cli-service/lib/commands/build/resolveLibConfig.js

@@ -75,6 +75,9 @@ module.exports = (api, { entry, name }, options) => {
       .alias
         .set('~entry', fullEntryPath)
 
+    // set output target before user configureWebpack hooks are applied
+    config.output.libraryTarget(format)
+
     // set entry/output after user configureWebpack hooks are applied
     const rawConfig = api.resolveWebpackConfig(config)