Személyre Szabott Navigáció

Vegyük a bemutató oldalt példaként a navigáció testreszabásához i18n-demo.github.io

A fenti ábra számozott területeinek megfelelő fájlok a következők:

  1. Balra .i18n/htm/t1.pug
  2. Jobb .i18n/htm/t2.pug

A pug egy sablonnyelv, amely HTML -eket generál.

➔ Kattintson ide a nyelvtan megtanulásához pug

A ${I18N.sponsor} formátumú karakterláncot használjuk a fájlban a nemzetköziesítés megvalósításához, és a tartalma a megfelelő szöveggel lesz helyettesítve a forrásnyelvi könyvtárban i18n.yml

A navigációs sáv stílusának megfelelő fájl : .i18n/htm/topbar.css

[!WARN] Ne írjon css és js t pug -ba , különben hiba lép fel.

Web Összetevők

js nem írható pug ba. Ha interakcióra van szükség, azt webkomponens létrehozásával lehet elérni.

Az összetevők md/.i18n/htm/index.js -ban határozhatnak meg egy weboldal-összetevőt , majd használhatják az foot.pug -es komponenst.

Könnyen létrehozhat webes összetevőket, például egyéni <x-img> .

customElements.define(
  'x-img',
  class extends HTMLElement {
    constructor() {
      super();
      var img = document.createElement('img');
      img.src = '//p.3ti.site/i18n.svg';
      img.style = "height:99px;width:99px;";
      this.append(img);
    }
  }
)

Jelenleg x/i-h.js hivatkozunk md/.i18n/htm/index.js ban, amely a navigáció és a láblécek testreszabott tartalomszövegei nemzetközivé tételére szolgál. Lásd a forráskódot 18x/src/i-h.js