0.2.1 • Published 5 years ago
scss-dom v0.2.1
scss-dom
Demo
If you do a development in accordance with the BEM methodology, you'll get html outputs with high dimensions in size. Using "scss-dom" reduces the size of html files.
import script
<head>
<script src="/path/to/scss-dom.js"></script>
</head>
You can use the reference selector.
<div class="header other-class">
<div class="&-menu">
<div class="&__item">1</div>
<div class="&__item">2</div>
<div class="&__item">3</div>
<div class="&__item">4</div>
</div>
</div>
init
document.addEventListener("DOMContentLoaded", () => {
scssDom();
});
after init dom
<div class="header other-class">
<div class="header-menu">
<div class="header-menu__item">1</div>
<div class="header-menu__item">2</div>
<div class="header-menu__item">3</div>
<div class="header-menu__item">4</div>
</div>
</div>
or
Install
npm install scss-dom
Usage
// import
import scssDom from "scssDom";
// init
scssDom();