Is it possible in some editor, such as Sublime Text, to enable automatic addition of styles in style.css, according to the structure of the html file?

Question

Notepad++

For example, there is a piece of code:

<div>
      <div class="setk right">
        <div class="img"></div>
        <div class="text">
          <h3>Оформим ЭЦП для ЕГАИС</h3>
          <p>Оформим электронную подпись для подписания документов и деклараций в ЕГАИС</p>
        </div>
      </div>
      <div class="setk left">
        <div class="img"></div>
        <div class="text">
          <h3>Установим программы для работы с ЭЦП</h3>
          <p>Установим актуальные сертифицированные версии программ для работы с ЭЦП на портале ЕГАИС: «КриптоПро CSP» и «ЕГАИС Крипто»</p>
        </div>
      </div>
      <div class="setk right">
        <div class="img"></div>
        <div class="text">
          <h3>Настроим рабочее место</h3>
          <p>Настроим рабочее место для работы сертификата электронной подписи</p>
        </div>
      </div>
      <div class="setk left">
        <div class="img"></div>
        <div class="text">
          <h3>Зарегистрируем в ЕГАИС</h3>
          <p>Зарегистрируем на портале ЕГАИС «Учет древесины и сделок с ней»</p>
        </div>
      </div>
      <div class="setk">
        <div class="img"></div>
        <div class="text">
          <h3>Обучим работе в ЕГАИС</h3>
          <p>Обучим работе с системой, расскажем все нюансы заполнения и отправки деклараций по учету древесины</p>
        </div>
      </div>
    </div>
  </div>

Is it possible that when writing code in index.html it will be automatically generated in style.css? For example, of the form:

.setk {}
.setk .img {}
.setk .text {}

I would be grateful for any advice on this topic!

Answer 1

You won't be able to do this with the basic sublime tools. Firstly, this is a simple code editor, not an IDE at all, it can be configured in some IDE, but I don’t use them.
Theoretically, this can be done with nodejs. True, it will take a very long time to think, write regular expressions, write cases for id, class and other attributes. The node has all the necessary basic modules to implement such an idea, which can be turned into a plugin. I haven't seen the like yet. I would use this set of modules (yes yes - you need it - don't be lazy and write =) ).
https://nodejs.org/dist/latest-v8.x/docs/api/path.html find files
https://nodejs.org/dist/latest-v8.x/docs/api/fs.html get control and reading html files, pulling out the right one, writing and adding css
https://nodejs.org/dist/latest-v8.x/docs/api/event... for callbacks to change fs.watch files and recompile.