diff --git a/packages/plugin-vue/README.md b/packages/plugin-vue/README.md index 57656766..d8135e9c 100644 --- a/packages/plugin-vue/README.md +++ b/packages/plugin-vue/README.md @@ -58,6 +58,10 @@ export interface Options { * - **default:** `false` */ prodHydrationMismatchDetails?: boolean + /** + * Custom value to add to data-attribute for components with `scoped` styles + */ + dataAttributeSalt?: string } // `script`, `template` and `style` are lower-level compiler options diff --git a/packages/plugin-vue/src/index.ts b/packages/plugin-vue/src/index.ts index 17d00add..54e0db92 100644 --- a/packages/plugin-vue/src/index.ts +++ b/packages/plugin-vue/src/index.ts @@ -138,6 +138,11 @@ export interface Options { * - **default:** `false` */ prodHydrationMismatchDetails?: boolean + + /** + * Custom value to add to data-attribute for components with `scoped` styles + */ + dataAttributeSalt?: string } /** diff --git a/packages/plugin-vue/src/utils/descriptorCache.ts b/packages/plugin-vue/src/utils/descriptorCache.ts index 7f643d1b..6929d1f3 100644 --- a/packages/plugin-vue/src/utils/descriptorCache.ts +++ b/packages/plugin-vue/src/utils/descriptorCache.ts @@ -22,7 +22,14 @@ const prevCache = new Map() export function createDescriptor( filename: string, source: string, - { root, isProduction, sourceMap, compiler, template }: ResolvedOptions, + { + root, + isProduction, + sourceMap, + compiler, + template, + features, + }: ResolvedOptions, hmr = false, ): SFCParseResult { const { descriptor, errors } = compiler.parse(source, { @@ -34,7 +41,8 @@ export function createDescriptor( // ensure the path is normalized in a way that is consistent inside // project (relative to root) and on different systems. const normalizedPath = normalizePath(path.relative(root, filename)) - descriptor.id = getHash(normalizedPath + (isProduction ? source : '')) + const hash = getHash(normalizedPath + (isProduction ? source : '')) + descriptor.id = `${hash}${features?.dataAttributeSalt ?? ''}` ;(hmr ? hmrCache : cache).set(filename, descriptor) return { descriptor, errors } }