Less

Avaa ChatGPT:ssä

Less on tyylitiedostokieli, joka lisää muuttujia, sekoittimia ja sisennystä CSS:ään. Less-laajennus aktivoituu, kun .less-lähde on läsnä, ja kääntää sen CSS:ksi.

Esimerkki

less/box.less

@accent: #2e9e6b;

.box {
  padding: 1rem;
  border: 2px solid @accent;
}

LessView.java

@Route("/less")
@BundleEntry("less/box.less")
public class LessView extends Composite<FlexLayout> {
  private final FlexLayout self = getBoundComponent();

  public LessView() {
    Div box = new Div().addClassName("box");
    self.add(box);
  }
}

Vaihtoehdot

Less-laajennus välittää vaihtoehtonsa Less-sivustolle, jota se kutsuu renderöidäkseen jokaisen lähteen. Tiedostonimi määritellään puolestasi. Aseta loput webforj-less alle bun.config.ts-tiedostossa:

src/main/frontend/bun.config.ts

export const options = {
  'webforj-less': { /* Less options */ }
};