update

node_modules/vue-loader/lib/loaders/pitcher.js

@@ -4,19 +4,20 @@ const hash = require('hash-sum')
 const selfPath = require.resolve('../index')
 const templateLoaderPath = require.resolve('./templateLoader')
 const stylePostLoaderPath = require.resolve('./stylePostLoader')
+const { resolveCompiler } = require('../compiler')
 
-const isESLintLoader = l => /(\/|\\|@)eslint-loader/.test(l.path)
-const isNullLoader = l => /(\/|\\|@)null-loader/.test(l.path)
-const isCSSLoader = l => /(\/|\\|@)css-loader/.test(l.path)
-const isCacheLoader = l => /(\/|\\|@)cache-loader/.test(l.path)
-const isPitcher = l => l.path !== __filename
-const isPreLoader = l => !l.pitchExecuted
-const isPostLoader = l => l.pitchExecuted
+const isESLintLoader = (l) => /(\/|\\|@)eslint-loader/.test(l.path)
+const isNullLoader = (l) => /(\/|\\|@)null-loader/.test(l.path)
+const isCSSLoader = (l) => /(\/|\\|@)css-loader/.test(l.path)
+const isCacheLoader = (l) => /(\/|\\|@)cache-loader/.test(l.path)
+const isPitcher = (l) => l.path !== __filename
+const isPreLoader = (l) => !l.pitchExecuted
+const isPostLoader = (l) => l.pitchExecuted
 
-const dedupeESLintLoader = loaders => {
+const dedupeESLintLoader = (loaders) => {
   const res = []
   let seen = false
-  loaders.forEach(l => {
+  loaders.forEach((l) => {
     if (!isESLintLoader(l)) {
       res.push(l)
     } else if (!seen) {
@@ -27,8 +28,8 @@ const dedupeESLintLoader = loaders => {
   return res
 }
 
-const shouldIgnoreCustomBlock = loaders => {
-  const actualLoaders = loaders.filter(loader => {
+const shouldIgnoreCustomBlock = (loaders) => {
+  const actualLoaders = loaders.filter((loader) => {
     // vue-loader
     if (loader.path === selfPath) {
       return false
@@ -44,7 +45,7 @@ const shouldIgnoreCustomBlock = loaders => {
   return actualLoaders.length === 0
 }
 
-module.exports = code => code
+module.exports = (code) => code
 
 // This pitching loader is responsible for intercepting all vue block requests
 // and transform it into appropriate requests.
@@ -61,7 +62,7 @@ module.exports.pitch = function (remainingRequest) {
     // if this is an inline block, since the whole file itself is being linted,
     // remove eslint-loader to avoid duplicate linting.
     if (/\.vue$/.test(this.resourcePath)) {
-      loaders = loaders.filter(l => !isESLintLoader(l))
+      loaders = loaders.filter((l) => !isESLintLoader(l))
     } else {
       // This is a src import. Just make sure there's not more than 1 instance
       // of eslint present.
@@ -77,7 +78,7 @@ module.exports.pitch = function (remainingRequest) {
     return
   }
 
-  const genRequest = loaders => {
+  const genRequest = (loaders) => {
     // Important: dedupe since both the original rule
     // and the cloned rule would match a source import request.
     // also make sure to dedupe based on loader path.
@@ -89,10 +90,9 @@ module.exports.pitch = function (remainingRequest) {
     const seen = new Map()
     const loaderStrings = []
 
-    loaders.forEach(loader => {
-      const identifier = typeof loader === 'string'
-        ? loader
-        : (loader.path + loader.query)
+    loaders.forEach((loader) => {
+      const identifier =
+        typeof loader === 'string' ? loader : loader.path + loader.query
       const request = typeof loader === 'string' ? loader : loader.request
       if (!seen.has(identifier)) {
         seen.set(identifier, true)
@@ -102,10 +102,11 @@ module.exports.pitch = function (remainingRequest) {
       }
     })
 
-    return loaderUtils.stringifyRequest(this, '-!' + [
-      ...loaderStrings,
-      this.resourcePath + this.resourceQuery
-    ].join('!'))
+    return loaderUtils.stringifyRequest(
+      this,
+      '-!' +
+        [...loaderStrings, this.resourcePath + this.resourceQuery].join('!')
+    )
   }
 
   // Inject style-post-loader before css-loader for scoped CSS and trimming
@@ -120,35 +121,42 @@ module.exports.pitch = function (remainingRequest) {
         ...beforeLoaders
       ])
       // console.log(request)
-      return `import mod from ${request}; export default mod; export * from ${request}`
+      return query.module
+        ? `export { default } from  ${request}; export * from ${request}`
+        : `export * from ${request}`
     }
   }
 
   // for templates: inject the template compiler & optional cache
   if (query.type === `template`) {
     const path = require('path')
-    const cacheLoader = cacheDirectory && cacheIdentifier
-      ? [`${require.resolve('cache-loader')}?${JSON.stringify({
-        // For some reason, webpack fails to generate consistent hash if we
-        // use absolute paths here, even though the path is only used in a
-        // comment. For now we have to ensure cacheDirectory is a relative path.
-        cacheDirectory: (path.isAbsolute(cacheDirectory)
-          ? path.relative(process.cwd(), cacheDirectory)
-          : cacheDirectory).replace(/\\/g, '/'),
-        cacheIdentifier: hash(cacheIdentifier) + '-vue-loader-template'
-      })}`]
-      : []
+    const cacheLoader =
+      cacheDirectory && cacheIdentifier
+        ? [
+            `${require.resolve('cache-loader')}?${JSON.stringify({
+              // For some reason, webpack fails to generate consistent hash if we
+              // use absolute paths here, even though the path is only used in a
+              // comment. For now we have to ensure cacheDirectory is a relative path.
+              cacheDirectory: (path.isAbsolute(cacheDirectory)
+                ? path.relative(process.cwd(), cacheDirectory)
+                : cacheDirectory
+              ).replace(/\\/g, '/'),
+              cacheIdentifier: hash(cacheIdentifier) + '-vue-loader-template'
+            })}`
+          ]
+        : []
 
     const preLoaders = loaders.filter(isPreLoader)
     const postLoaders = loaders.filter(isPostLoader)
+    const { is27 } = resolveCompiler(this.rootContext, this)
 
     const request = genRequest([
       ...cacheLoader,
       ...postLoaders,
-      templateLoaderPath + `??vue-loader-options`,
+      ...(is27 ? [] : [templateLoaderPath + `??vue-loader-options`]),
       ...preLoaders
     ])
-    // console.log(request)
+
     // the template compiler uses esm exports
     return `export * from ${request}`
   }

node_modules/vue-loader/lib/loaders/stylePostLoader.js

@@ -1,17 +1,19 @@
 const qs = require('querystring')
-const { compileStyle } = require('@vue/component-compiler-utils')
+const { resolveCompiler } = require('../compiler')
 
 // This is a post loader that handles scoped CSS transforms.
 // Injected right before css-loader by the global pitcher (../pitch.js)
 // for any <style scoped> selection requests initiated from within vue files.
 module.exports = function (source, inMap) {
   const query = qs.parse(this.resourceQuery.slice(1))
-  const { code, map, errors } = compileStyle({
+  const { compiler } = resolveCompiler(this.rootContext, this)
+  const { code, map, errors } = compiler.compileStyle({
     source,
     filename: this.resourcePath,
     id: `data-v-${query.id}`,
     map: inMap,
     scoped: !!query.scoped,
+    isProd: query.prod != null,
     trim: true
   })
 

node_modules/vue-loader/lib/loaders/templateLoader.js

@@ -1,12 +1,16 @@
 const qs = require('querystring')
 const loaderUtils = require('loader-utils')
-const { compileTemplate } = require('@vue/component-compiler-utils')
+const { resolveCompiler } = require('../compiler')
+const { getDescriptor } = require('../descriptorCache')
+const { resolveScript } = require('../resolveScript')
 
 // Loader that compiles raw template into JavaScript functions.
 // This is injected by the global pitcher (../pitch) for template
 // selection requests initiated from vue files.
 module.exports = function (source) {
   const loaderContext = this
+  const filename = this.resourcePath
+  const ctx = this.rootContext
   const query = qs.parse(this.resourceQuery.slice(1))
 
   // although this is not the main vue-loader, we can get access to the same
@@ -15,24 +19,33 @@ module.exports = function (source) {
   const options = loaderUtils.getOptions(loaderContext) || {}
   const { id } = query
   const isServer = loaderContext.target === 'node'
-  const isProduction = options.productionMode || loaderContext.minimize || process.env.NODE_ENV === 'production'
+  const isProduction =
+    options.productionMode ||
+    loaderContext.minimize ||
+    process.env.NODE_ENV === 'production'
   const isFunctional = query.functional
 
-  // allow using custom compiler via options
-  const compiler = options.compiler || require('vue-template-compiler')
+  const compilerOptions = Object.assign(
+    {
+      outputSourceRange: true
+    },
+    options.compilerOptions,
+    {
+      scopeId: query.scoped ? `data-v-${id}` : null,
+      comments: query.comments
+    }
+  )
 
-  const compilerOptions = Object.assign({
-    outputSourceRange: true
-  }, options.compilerOptions, {
-    scopeId: query.scoped ? `data-v-${id}` : null,
-    comments: query.comments
-  })
+  const { compiler, templateCompiler } = resolveCompiler(ctx, loaderContext)
 
-  // for vue-component-compiler
+  const descriptor = getDescriptor(filename, options, loaderContext)
+  const script = resolveScript(descriptor, id, options, loaderContext)
+
+  // for vue/compiler-sfc OR @vue/component-compiler-utils
   const finalOptions = {
     source,
     filename: this.resourcePath,
-    compiler,
+    compiler: options.compiler || templateCompiler,
     compilerOptions,
     // allow customizing behavior of vue-template-es2015-compiler
     transpileOptions: options.transpileOptions,
@@ -40,36 +53,42 @@ module.exports = function (source) {
     isProduction,
     isFunctional,
     optimizeSSR: isServer && options.optimizeSSR !== false,
-    prettify: options.prettify
+    prettify: options.prettify,
+    bindings: script ? script.bindings : undefined
   }
 
-  const compiled = compileTemplate(finalOptions)
+  const compiled = compiler.compileTemplate(finalOptions)
 
   // tips
   if (compiled.tips && compiled.tips.length) {
-    compiled.tips.forEach(tip => {
+    compiled.tips.forEach((tip) => {
       loaderContext.emitWarning(typeof tip === 'object' ? tip.msg : tip)
     })
   }
 
   // errors
   if (compiled.errors && compiled.errors.length) {
+    const generateCodeFrame =
+      (templateCompiler && templateCompiler.generateCodeFrame) ||
+      compiler.generateCodeFrame
     // 2.6 compiler outputs errors as objects with range
-    if (compiler.generateCodeFrame && finalOptions.compilerOptions.outputSourceRange) {
+    if (generateCodeFrame && finalOptions.compilerOptions.outputSourceRange) {
       // TODO account for line offset in case template isn't placed at top
       // of the file
       loaderContext.emitError(
         `\n\n  Errors compiling template:\n\n` +
-        compiled.errors.map(({ msg, start, end }) => {
-          const frame = compiler.generateCodeFrame(source, start, end)
-          return `  ${msg}\n\n${pad(frame)}`
-        }).join(`\n\n`) +
-        '\n'
+          compiled.errors
+            .map(({ msg, start, end }) => {
+              const frame = generateCodeFrame(source, start, end)
+              return `  ${msg}\n\n${pad(frame)}`
+            })
+            .join(`\n\n`) +
+          '\n'
       )
     } else {
       loaderContext.emitError(
         `\n  Error compiling template:\n${pad(compiled.source)}\n` +
-          compiled.errors.map(e => `  - ${e}`).join('\n') +
+          compiled.errors.map((e) => `  - ${e}`).join('\n') +
           '\n'
       )
     }
@@ -81,9 +100,9 @@ module.exports = function (source) {
   return code + `\nexport { render, staticRenderFns }`
 }
 
-function pad (source) {
+function pad(source) {
   return source
     .split(/\r?\n/)
-    .map(line => `  ${line}`)
+    .map((line) => `  ${line}`)
     .join('\n')
 }