diff --git a/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts b/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts index 4459d249bed274dee0a18fe58c3db84f9574acf2..c061ec4735282c4738456f4ddf331d0961e52435 100644 --- a/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts +++ b/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts @@ -25,40 +25,42 @@ classNames.forEach((className, index) => { if (state.jit) { let { rules } = jit.generateRules(state, [className.className]) - if (rules.length === 0) { + if (rules.length !== 1) { return } - - let info: Array<{ context: string[]; properties: string[] }> = rules.map((rule) => { - let properties: string[] = [] - rule.walkDecls(({ prop }) => { - properties.push(prop) - }) - let context = jit.getRuleContext(state, rule, className.className) - return { context, properties } + let rule = rules[0] + let context: string[] + let properties = [] + rule.walkDecls(({ prop }) => { + properties.push(prop) }) let otherClassNames = classNames.filter((_className, i) => i !== index) let conflictingClassNames = otherClassNames.filter((otherClassName) => { - let { rules: otherRules } = jit.generateRules(state, [otherClassName.className]) - if (otherRules.length !== rules.length) { + let { rules } = jit.generateRules(state, [otherClassName.className]) + if (rules.length !== 1) { return false } - for (let i = 0; i < otherRules.length; i++) { - let rule = otherRules[i] - let properties: string[] = [] - rule.walkDecls(({ prop }) => { - properties.push(prop) - }) - if (!equal(info[i].properties, properties)) { - return false - } - let context = jit.getRuleContext(state, rule, otherClassName.className) - if (!equal(info[i].context, context)) { - return false - } + let otherRule = rules[0] + + let otherProperties = [] + otherRule.walkDecls(({ prop }) => { + otherProperties.push(prop) + }) + + if (!equal(properties, otherProperties)) { + return false + } + + if (!context) { + context = jit.getRuleContext(state, rule, className.className) + } + let otherContext = jit.getRuleContext(state, otherRule, otherClassName.className) + + if (!equal(context, otherContext)) { + return false } return true @@ -75,7 +77,9 @@ severity: severity === 'error' ? 1 /* DiagnosticSeverity.Error */ : 2 /* DiagnosticSeverity.Warning */, - message: `'${className.className}' applies the same CSS properties as ${joinWithAnd( + message: `'${className.className}' applies the same CSS ${ + properties.length === 1 ? 'property' : 'properties' + } as ${joinWithAnd( conflictingClassNames.map( (conflictingClassName) => `'${conflictingClassName.className}'` )