when developing for web (in Vim) I'm always using the BEM methodology. I have identified that I always go through the same steps when adding a new block element, and I'm looking for ways to automate the whole/or parts of the process.
What I now have to do for each block being added:
c- is expanded and edited into something like this:
<!-- Component: Button --> <div class="c-button"> <div class="c-button__border"> <img class="c-button__icon" src="img/mic-off.svg" /> </div> <p class="c-button__title">Mic off</p> </div>
Then I have to navigate to
src/sass/components/ and add a file named
_c-button.sass with the content:
.c-button &__border &__icon &__title
src/sass/main.sass and add
@import 'components/button' to the end of the file.
So any tips/ideas how to start to automate this process further?