smalljs$molSzukaj⌘ KDokumentacjaPlaygroundPorównanieEkosystemO projekciePL
InstalacjaGetting StartedWprowadzenieModel mentalnyPierwsze krokiZ TypeScriptu do view.treeStruktura projektuNarzędziaEssentialsInstalacjaWidokiStan i reaktywnośćRoutingRenderowanieTestowanieWdrożenieRozwiązywanie problemówDataPobieranie danychSchematy danychGiper BazaMorePrezentacjaZ React, Vue i SvelteZbiór przepisówAdvancedWtyczkiMetadane modułuOfflineWidoki-duchyAboutFAQZespółWydaniaAPI$mol_button_major$mol_button_minor$mol_string$mol_number$mol_text$mol_paragraph$mol_list$mol_row$mol_link$mol_check$mol_switch$mol_select$mol_scroll$mol_page$mol_pick

Instalacja

Pierwsze kroki prowadzą Cię krok po kroku przez pierwszą aplikację. Ta strona to materiał referencyjny: jak zorganizowany jest projekt $mol i jak działa budowanie.

Wymagania

Node.js 18+ i git. Nic więcej nie jest instalowane globalnie.

Przestrzeń robocza MAM

Aplikacje $mol żyją wewnątrz MAM — narzędzia budującego i rejestru modułów. Klonujesz je raz i rozwijasz swoje moduły w środku:1git clone https://github.com/hyoo-ru/mam.git ./mam2cd mam3npm install4npm startnpm start uruchamia obserwujący serwer deweloperski pod adresem http://localhost:9080/. Przebudowuje przy zapisie i automatycznie rozwiązuje zależności — nigdy nie utrzymujesz konfiguracji bundlera.

Jak nazywane są moduły

Każda nazwa komponentu odpowiada ścieżce folderu, a każdy podkreślnik jest separatorem folderów:1$my_app → my/app/2$my_app_header → my/app/header/Nazwy folderów modułów nigdy nie zawierają podkreślnika — dla nazw wielowyrazowych używaj zagnieżdżonych folderów. Jeśli używany komponent nigdy nie pojawia się w bundlu, prawie zawsze ścieżka folderu nie odpowiada nazwie klasy.

Anatomia modułu

Komponent to folder zawierający maksymalnie cztery pliki:PlikPrzeznaczeniename.view.treeDeklaratywny układname.view.tsZachowanie (TypeScript)name.view.css.tsTypowane stylename.view.tree, index.htmlPunkt wejścia modułu aplikacjiindex.html aplikacji montuje komponent główny:1<body mol_view_root>2 <div mol_view_root="$my_app"></div>3 <script src="web.js"></script>4</body>

Budowanie na produkcję

Serwer deweloperski buduje w locie, ale możesz zbudować dowolny moduł jawnie z katalogu głównego przestrzeni roboczej:1npm run start my/appWynik trafia do my/app/-/ — w tym web.js, web.css i web.audit.js. Zawsze sprawdzaj audyt: czysty web.audit.js oznacza brak nieużywanych zależności i brak błędów typów.

Dodawanie pakietów npm

Odwołaj się do pakietu przez require, a MAM zainstaluje go przy następnym budowaniu:1const dayjs = require( 'dayjs' ) as typeof import( 'dayjs' )

Dalej

Edytuj tę stronę na GitHubieCzy to było pomocne?TakNiePoprzedniaNarzędziaNastępnaWidokiNa tej stronieWymaganiaPrzestrzeń robocza MAMJak nazywane są modułyAnatomia modułuBudowanie na produkcjęDodawanie pakietów npmDalej
Type to search the documentation.