Added Prefix Selector support via important config

This commit is contained in:
James Wee 2019-07-11 17:07:24 +12:00 • committed by James Wee
parent c9bba9d1b1
commit 382075731d
6 changed files with 100 additions and 1 deletions

View file

@ -2,6 +2,7 @@ import _ from 'lodash'
import postcss from 'postcss'
import escapeClassName from '../util/escapeClassName'
import prefixSelector from '../util/prefixSelector'
import increaseSpecificity from '../util/increaseSpecificity'
function buildClassTable(css) {
const classTable = {}
@ -85,6 +86,8 @@ export default function(config, generatedUtilities) {
() => findClass(classToApply, classLookup, onError),
() => findClass(classToApply, shadowLookup, onError),
() => findClass(prefixSelector(config.prefix, classToApply), shadowLookup, onError),
// prettier-ignore
() => findClass(increaseSpecificity(config.important, classToApply), shadowLookup, onError),
() => {
// prettier-ignore
throw onError(`\`@apply\` cannot be used with \`${classToApply}\` because \`${classToApply}\` either cannot be found, or its actual definition includes a pseudo-selector like :hover, :active, etc. If you're sure that \`${classToApply}\` exists, make sure that any \`@import\` statements are being properly processed *before* Tailwind CSS sees your CSS, as \`@apply\` can only be used for classes in the same CSS tree.`)