feat: support css v-bind (requires 2.7.0-beta.3)

vuejs · Jun 20, 2022 · d653f3b · d653f3b
1 parent ac12698
commit d653f3b
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 15 deletions.
diff --git a/lib/index.js b/lib/index.js
@@ -66,32 +66,31 @@ module.exports = function (source) {
   // cache descriptor
   setDescriptor(resourcePath, descriptor)
 
+  // module id for scoped CSS & hot-reload
+  const rawShortFilePath = path
+    .relative(context, resourcePath)
+    .replace(/^(\.\.[\/\\])+/, '')
+  const shortFilePath = rawShortFilePath.replace(/\\/g, '/')
+  const id = hash(
+    isProduction
+      ? shortFilePath + '\n' + source.replace(/\r\n/g, '\n')
+      : shortFilePath
+  )
+
   // if the query has a type field, this is a language block request
   // e.g. foo.vue?type=template&id=xxxxx
   // and we will return early
   if (incomingQuery.type) {
     return selectBlock(
       descriptor,
+      id,
       options,
       loaderContext,
       incomingQuery,
       !!options.appendExtension
     )
   }
 
-  // module id for scoped CSS & hot-reload
-  const rawShortFilePath = path
-    .relative(context, resourcePath)
-    .replace(/^(\.\.[\/\\])+/, '')
-
-  const shortFilePath = rawShortFilePath.replace(/\\/g, '/') + resourceQuery
-
-  const id = hash(
-    isProduction
-      ? shortFilePath + '\n' + source.replace(/\r\n/g, '\n')
-      : shortFilePath
-  )
-
   // feature information
   const hasScoped = descriptor.styles.some((s) => s.scoped)
   const hasFunctional =

diff --git a/lib/loaders/templateLoader.js b/lib/loaders/templateLoader.js
@@ -39,7 +39,7 @@ module.exports = function (source) {
   const { compiler, templateCompiler } = resolveCompiler(ctx, loaderContext)
 
   const descriptor = getDescriptor(filename, options, loaderContext)
-  const script = resolveScript(descriptor, options, loaderContext)
+  const script = resolveScript(descriptor, id, options, loaderContext)
 
   // for vue/compiler-sfc OR @vue/component-compiler-utils
   const finalOptions = {

diff --git a/lib/resolveScript.js b/lib/resolveScript.js
@@ -5,6 +5,7 @@ const serverCache = new WeakMap()
 
 exports.resolveScript = function resolveScript(
   descriptor,
+  scopeId,
   options,
   loaderContext
 ) {
@@ -37,6 +38,7 @@ exports.resolveScript = function resolveScript(
 
   try {
     resolved = compiler.compileScript(descriptor, {
+      id: scopeId,
       isProd,
       babelParserPlugins: options.babelParserPlugins
     })

diff --git a/lib/select.js b/lib/select.js
@@ -2,6 +2,7 @@ const { resolveScript } = require('./resolveScript')
 
 module.exports = function selectBlock(
   descriptor,
+  scopeId,
   options,
   loaderContext,
   query,
@@ -22,7 +23,7 @@ module.exports = function selectBlock(
 
   // script
   if (query.type === `script`) {
-    const script = resolveScript(descriptor, options, loaderContext)
+    const script = resolveScript(descriptor, scopeId, options, loaderContext)
     if (appendExtension) {
       loaderContext.resourcePath += '.' + (script.lang || 'js')
     }