LaravelLaravel & VueJsVueJs

BEM class name generator for Vue.js


BEM is an abbreviation of the key elements of the methodology — Block (Standalone entity that is meaningful on its own.), Element (A part of a block that has no standalone meaning and is semantically tied to its block) and Modifier (A flag on a block or element. Use them to change appearance or behavior.).

Also, BEM has strict naming rules which can be found here.

BEM — Block Element Modifier is a methodology that helps you to create reusable components and code sharing in front-end development. The idea behind it is to divide the user interface into independent blocks. This makes interface development easy and fast even with a complex UI, and it allows reuse of existing code without copying and pasting.

You can check the quick example of the vue-bem-cn, Block btn. Vue Single File Component, to get an idea how you can use the name generator in Vue.js, and the compiled result.

Take a look at the Live Demo to see how to call the b() method for class name generation. More examples in API section.

More info regarding BEM visit &

Find the vue-bem-cn on GitHub based on bem-cn-lite, by @c01nd01r.

Source link

★ READ ALSO ★  How To Create Your Own VBA Code Library In Excel

1 thought on “BEM class name generator for Vue.js”

  1. I have noticed you don’t monetize your website, don’t waste your
    traffic, you can earn additional bucks every month because you’ve got high quality content.
    If you want to know how to make extra bucks, search for: Boorfe’s tips best adsense

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.