Ыңгайлаштырылган Навигация

Навигацияны кантип ыңгайлаштырууну түшүндүрүү үчүн, мисал катары демо сайтты алалы i18n-demo.github.io

Жогорудагы сүрөттө номерленген аймактарга туура келген файлдар төмөнкүдөй:

  1. Сол .i18n/htm/t1.pug
  2. Оң .i18n/htm/t2.pug

pug - бул HTML лерди пайда кылган шаблон тили.

➔ Грамматиканы үйрөнүү үчүн бул жерди басыңыз pug

${I18N.sponsor} формат сабы интернационалдаштырууну ишке ашыруу үчүн колдонулат жана анын мазмуну баштапкы тил каталогунда тиешелүү текст менен алмаштырылат i18n.yml

Навигация тилкесинин стилине туура келген файл .i18n/htm/topbar.css :

[!WARN] pug css жана js деп жазбаңыз , антпесе ката болот.

Веб Компоненттери

js pug менен жазууга болбойт. Эгерде өз ара аракеттенүү керек болсо, ага веб-компонентти түзүү аркылуу жетишүүгө болот.

Компоненттер веб-баракчанын компонентин md/.i18n/htm/index.js аныктап, андан кийин foot.pug компонентти колдоно алат.

Ыңгайлаштырылган <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);
    }
  }
)

Учурда md/.i18n/htm/index.js шилтеме жасалууда, ал навигацияны жана колонтитулдарды ыңгайлаштырылган мазмундун текстин интернационалдаштыруу 18x/src/i-h.js колдонулган веб-компонент болуп x/i-h.js .