Nuxt module for Fela styling

Downloads in past


1.4.65 years ago5 years agoMinified + gzip package size for nuxt-fela in KB


npm npm (scoped with tag) NpmLicense
Add Fela a small, high-performant and framework-agnostic toolbelt to handle state-driven styling in JavaScript to Nuxt.


  • Add nuxt-fela dependency using yarn or npm to your project

yarn add nuxt-fela

  • Add nuxt-fela to modules section of nuxt.config.js

  modules: [

  fela: {
    components: ['Button', 'DatePicker'],
    locale: 'fr',

  modules: [
        components: ['Button', 'DatePicker'],
        locale: 'fr',

  • Add Element UI styles.


  • name: alignContent
shortcut: aC type: AlignContent
  • name: alignItems
shortcut: aI type: AlignItems
  • name: alignSelf
shortcut: aS type: AlignSelf
  • name: animation
shortcut: an type: string
  • name: animationDelay
shortcut: anDe type: NumberOrString unit: second
  • name: animationDirection
shortcut: anDi type: Animationdirection
  • name: animationDuration
shortcut: anDu type: NumberOrString unit: second
  • name: animationFillMode
shortcut: anFM type: AnimationFillMode
  • name: animationIterationCount
shortcut: anIC type: AnimationIterationCount
  • name: animationName
shortcut: anNa type: string
  • name: animationPlayState
shortcut: anPS type: AnimationPlayState
  • name: animationTimingFunction
shortcut: anTF type: string
  • name: backfaceVisibility
shortcut: bfV type: BackfaceVisibility
  • name: background
shortcut: bg type: string
  • name: backgroundAttachment
shortcut: bgA type: BackgroundAttachment
  • name: backgroundBlendMode
shortcut: bgBM type: string
  • name: backgroundClip
shortcut: bgCl type: BackgroundClip
  • name: backgroundColor
shortcut: bgC type: string
  • name: backgroundImage
shortcut: bgI type: string
  • name: backgroundOrigin
shortcut: bgO type: BackgroundOrigin
  • name: backgroundPosition
shortcut: bgP type: string
  • name: backgroundRepeat
shortcut: bgR type: string
  • name: backgroundSize
shortcut: bgS type: string
  • name: border
shortcut: b type: string
  • name: borderBottom
shortcut: bB type: string
  • name: borderBottomColor
shortcut: bBC type: string
  • name: borderBottomLeftRadius
shortcut: bBLRd type: NumberOrString
  • name: borderBottomRightRadius
shortcut: bBRRd type: NumberOrString
  • name: borderBottomStyle
shortcut: bBS type: string
  • name: borderBottomWidth
shortcut: bBW type: NumberOrString
  • name: borderCollapse
shortcut: bCo type: BorderCollapse
  • name: borderColor
shortcut: bC type: string
  • name: borderLeftColor
shortcut: bLC type: string
  • name: borderLeftStyle
shortcut: bLS type: string
  • name: borderLeftWidth
shortcut: bLW type: NumberOrString
  • name: borderRadius
shortcut: bRd type: NumberOrString
  • name: borderRightColor
shortcut: bRC type: string
  • name: borderRightStyle
shortcut: bRS type: string
  • name: borderRightWidth
shortcut: bRW type: NumberOrString
  • name: borderStyle
shortcut: bS type: string
  • name: borderTopColor
shortcut: bTC type: string
  • name: borderTopLeftRadius
shortcut: bTLRd type: NumberOrString
  • name: borderTopRightRadius
shortcut: bTRRd type: NumberOrString
  • name: borderTopStyle
shortcut: bTS type: string
  • name: borderTopWidth
shortcut: bTW type: NumberOrString
  • name: borderWidth
shortcut: bW type: NumberOrString
  • name: bottom
shortcut: b type: NumberOrString
  • name: color
shortcut: c type: string
  • name: content
shortcut: co type: AlignItems
  • name: cursor
shortcut: cu type: AlignSelf
  • name: direction
shortcut: di type: alignSelf
  • name: display
shortcut: d type: alignSelf
  • name: elevation
shortcut: el type: alignSelf
  • name: flex
shortcut: fl type: alignSelf
  • name: flexBasis
shortcut: flB type: alignSelf
  • name: flexDirection
shortcut: flD type: alignSelf
  • name: flexGrow
shortcut: flG type: alignSelf
  • name: flexShrink
shortcut: flS type: alignSelf
  • name: flexWrap
shortcut: flW type: alignSelf
  • name: fontFamily
shortcut: fF type: alignSelf
  • name: fontSize
shortcut: fS type: alignSelf
  • name: fontStyle
shortcut: anTF type: alignSelf
  • name: fontVariant
shortcut: fV type: alignSelf
  • name: fontWeight
shortcut: fW type: alignSelf
  • name: height
shortcut: h type: alignSelf
  • name: justifyContent
shortcut: jC type: alignSelf
  • name: left
shortcut: l type: alignSelf
  • name: letterSpacing
shortcut: lS type: alignSelf
  • name: lineHeight
shortcut: lH type: alignSelf
  • name: marginBottom
shortcut: mB type: alignSelf
  • name: marginLeft
shortcut: mL type: alignSelf
  • name: marginRight
shortcut: mR type: alignSelf
  • name: marginTop
shortcut: mT type: alignSelf
  • name: maxHeight
shortcut: maxH type: alignSelf
  • name: maxWidth
shortcut: maxW type: alignSelf
  • name: minHeight
shortcut: minH type: alignSelf
  • name: minWidth
shortcut: minW type: alignSelf
  • name: opacity
shortcut: o type: alignSelf
  • name: order
shortcut: anTF type: alignSelf
  • name: outlineColor
shortcut: ouC type: alignSelf
  • name: outlineWidth
shortcut: ouW type: alignSelf
  • name: overflow
shortcut: ov type: alignSelf
  • name: paddingBottom
shortcut: mB type: alignSelf
  • name: paddingLeft
shortcut: mL type: alignSelf
  • name: paddingRight
shortcut: mR type: alignSelf
  • name: paddingTop
shortcut: mT type: alignSelf
  • name: position
shortcut: p type: alignSelf
  • name: right
shortcut: r type: alignSelf
  • name: textAlign
shortcut: tA type: alignSelf
  • name: textDecorationColor
shortcut: tDC type: alignSelf
  • name: textDecorationLine
shortcut: tDL type: alignSelf
  • name: textDecorationStyle
shortcut: tDS type: alignSelf
  • name: top
shortcut: t type: alignSelf
  • name: transform
shortcut: tr type: alignSelf
  • name: width
shortcut: w type: NumberOrString unit: rem
  • name: zIndex
shortcut: zI type: ZIndex