Ar galiu naudoti kitokią CSS sistemą, o ne į uodegą

Tiesus atsakymas yra tas, kad siūlas pirmiausia yra skirtas dirbti su uodegos vėjo CSS, o jo komponentai, temos ir UI labai priklauso nuo „uodegos vėjo“ naudingumo klasių ir konvencijų. Šis griežtas sukabinimas reiškia, kad kitos CSS sistemos uodegos vėjo perjungimas nėra oficialiai palaikomas ar nesudėtingas. Tačiau šiek tiek pastangų ir pritaikymų galima pritaikyti kitas CSS sistemas, skirtas naudoti su gijomis, tačiau tai apima pasirinktinį temų kūrimą, svarbiausius numatytuosius stilius ir galbūt atstatyti kai kurias vartotojo sąsajos dalis nuo nulio.

***

gijų priklausomybė nuo uodegos vėjo CSS

Gydas naudoja uodegos vėją CSS kaip savo numatytąją ir pagrindinę stiliaus sistemą. Visa jo projektavimo sistema ir komponentai pasinaudoja „Tailwind“ naudingumo klasėmis, skirtomis išdėstymui, tarpai, spalvoms, tipografijai, reagavimui, interaktyvumui ir jų atžvilgiu. Numatytoji administratoriaus vartotojo sąsaja yra sukurta su uodegos vėju, o daugelis gijų papildinių ir plėtinių taip pat mano, kad „Uodegi“ vėjas yra CSS fondas.

Kadangi „Tailwind CSS“ naudoja pirmąjį naudingumo metodą, gijų temos apima „Uodegi“ komunalinių paslaugų pridėjimą ir pritaikymą, o ne rašyti tradicinius CSS ar pasikliauti pasauliniu mastu apibrėžtomis klasėmis. Tai lemia labai lanksčią ir pritaikomą vartotojo sąsają, tačiau taip pat reiškia, kad siūlelio komponentai tikisi, kad bus tinkamai pateiktos „uodegos vėjo“ komunalinės paslaugos.

***

Kitų CSS rėmų naudojimas su gijomis: iššūkiai ir požiūriai

Bandymas pakeisti uodegos vėją CSS kitu CSS sistema, pavyzdžiui, „Bootstrap“, „Bulma“, „Fondas“ ar „Materialize“ susiduria su keliais iššūkiais:

-Klasių pavadinimai ir komunalinės paslaugos: Kiti rėmai turi skirtingas klasės pavadinimus ir CSS metodikas (pvz., „Bootstrap“ naudoja semantinių klasių pavadinimus, tokius kaip „.btn“, „.Container“, tuo tarpu „uodegos vėjas“ naudoja naudingumo klases, tokias kaip „BG-Blue-500“, „P-4“). Kai kuriuose gijų komponentai plačiai naudoja „Tailwind“ klasės pavadinimus, todėl norint pakeisti CSS reikia perrašyti komponentų klases arba sukurti analogiškus stilius naujoje sistemoje.

- Reagavimo ir tinklo sistemos: „Uodegi“ vėjas naudoja savo reaguojančias projektavimo komunalines paslaugas, pagrįstas pirmąja mobiliųjų telefonų tinklo sistema. Kiti rėmai turi skirtingus tinklelio ir lūžio taškų apibrėžimus, kurie gali būti ne taip gerai susietos su uodegos vėjo požiūriu.

- Individualizuoti komponentai ir sąveika: daugelis gijų UI komponentų integruoja uodegos vėjo pagrindu sukurtus perėjimus, animacijas ir būsenas. Tai gali reikėti atkartoti naudojant „JavaScript“ ar kitas CSS rėmų galimybes.

-Sukurkite procesą: Gydelio kūrimo procesas paprastai apima „Utagewind“ „Just-In-Time“ (JIT) kompiliatoriaus konfigūravimą, kad būtų sukurta tik būtinos CSS klasės. Naudojant kitą sistemą, reikia sureguliuoti ar pakeisti CSS statybos dujotiekį.

Nepaisant šių kliūčių, pažengę vartotojai, norintys naudoti kitą sistemą, gali apsvarstyti:

- Sukurti pasirinktinį siūlų temą: Norėdami naudoti pasirinktas CSS klases, galite nepaisyti numatytųjų siūlų vaizdų ir ašmenų komponentų, pritaikydami savo CSS Framework klases, o ne į uodegos vėją. Tam reikia gilių žinių tiek apie gijų vidinius, tiek jūsų pasirinktą CSS sistemą.

- Naudodamiesi „Uodegos vėjo“ suderinamais plėtiniais: Kai kurie CSS rėmai arba UI bibliotekos, kurios yra suderinamos su uodegos vėjo viršuje (pavyzdžiui, „Daisyui“), kuri gali pridėti iš anksto pastatytų komponentų ir lengviau juos pridėti ant uodegos vėjo CSS viršaus, visiškai nepakeisdamas.

- Pakeitus „Tailwind CSS“ į vanilinę CSS arba pasirinktinę naudingumo sistemą: vietoj viso CSS sistemoje kai kurie kūrėjai sukuria minimalią CSS naudingumo biblioteką, įkvėptą „Uodegi“ požiūrio. Tai gali veikti, bet reiškia patys kurti daugybę stilių.

***

alternatyvos „uodegos vėjui“ CSS, skirtas formuoti siūlą

Jei norite naudoti kitokią CSS sistemą siūleliams, čia yra trumpa kai kurių populiarių alternatyvų apžvalga ir tai, kaip jos palyginamos su šiuo naudojimo atveju:

-„Bootstrap“: plačiausiai naudojama CSS sistema, siūlanti komponentų pagrindu sukurtą stilių su iš anksto nustatytomis mygtukų, formų, tinklelių ir kt. Klasėmis, įkrovos yra sunkesnės nei uodegos vėjas, o ne pirmas naudingumas. Integruoti „Bootstrap“ su gijiniu, reikės perrašyti visas „uodegos vėjo“ klases gijų šablonuose su „Bootstrap“ klasėmis ir galbūt perrašyti interaktyvų elgesį naudojant „Bootstrap“ „JavaScript“.

- „Bulma“: modernus, lengvas CSS karkasas, pagrįstas „Flexbox“. Jis yra moduliniai ir naudoja semantinių klasių pavadinimus, o ne pirmosios naudingumo klasės. Panašiai kaip „Bootstrap“, naudojant „Bulma“ su siūlais, reikia pritaikytos temos nepaisymo, o „Bulma“ ekvivalentų pakartotinai perdaryti „uodegos vėjo“ komunalines paslaugas.

- Fondas: dar viena išsami CSS sistema, palaikanti tinklelį ir reaguojančius išdėstymus. Jo mokymosi kreivė ir integracijos sudėtingumas yra panašus į „Bootstrap“ ir „Bulma“.

- „Materialize“ arba „Material UI“: CSS sistemos, pagrįstos „Google“ medžiagos dizainu. Jie siūlo išankstinius UI komponentus, suderintus su medžiagų projektavimo principais. Naudojant juos vietoj „uodegos vėjo“, reikia atstatyti gijų vartotojo sąsają, kad jis atitiktų medžiagų gaires ir pritaikymą komponentams su konkrečiomis medžiagomis skirtomis klasėmis ir scenarijais.

- „Daisyui“: ne pakaitalas, o „uodegos vėjo“ CSS papildinys, kuris teikia komponentų klases, skirtas supaprastinti stilių. Tai gali sumažinti jūsų CSS darbo krūvį, išlaikant uodegos vėją kaip pagrindinę sistemą, naudingą gijų vartotojams, norintiems greitesnio stiliaus, neatsisakydami uodegos vėjo.

***

Techniniai veiksmai, skirti naudoti kitokią CSS sistemą su gijiniu

Jei nuspręsite tęsti kitą CSS sistemą, čia yra bendrieji techniniai veiksmai:

1. Išjunkite arba išimkite vėjo CSS iš siūlelio turto vamzdyno, kad būtų išvengta susirėmimų.

2. Pridėkite pasirinktą CSS sistemą prie savo „Laravel“ projekto per NPM, CDN ar tiesioginį failo įtraukimą.

3. Nepaisykite gijinių vaizdų ir komponentų: Paskelbkite gijų vaizdus, ​​naudodami „PHP Artisan Pardsor: Publish“, tada redaguokite „Blade“ šablonus, kad pakeistumėte uodegos vėjo klases jūsų sistemos klasėmis.

4. Atstatykite pasirinktinius komponentus: Jei kaitinimo siūlės, interaktyvių komponentų, perrašykite tas interaktyvias dalis naudodami „JavaScript“ arba „JavaScript“ komunalines paslaugas jūsų CSS sistemoje.

5. Pakoreguokite konfigūraciją: Jei reikia, atnaujinkite gijų konfigūracijos failus, kad pritaikytumėte CSS ir JS turto kelius.

6. Testo vartotojo sąsaja kruopščiai: reaguoti dizainas, prieinamumas ir naršyklės suderinamumas turi būti patvirtintas, nes gali skirtis naujojo „Framework“ dizaino modelis.

***

Privalumai ir trūkumai, naudojant kitus rėmus su siūlais

Privalumai:

- Galite panaudoti esamas žinias ir dizaino sistemas, susipažinusias su savo komanda.
- Pakartotinai panaudokite CSS sistemas, naudojamas kitose jūsų programos dalyse, kad būtų galima nuoseklumui.
- Jei norite, naudokite rėmus su labiau paruoštais UI komponentais.

Trūkumai:

- Reikia didelių pastangų, nes pagal numatytuosius nustatymus „Uodegiwind CSS“ siūlo gijų.
- praranda griežtą integracijos pranašumus, tokius kaip „JIT CSS Generation“, „Ensing Leads“ ir pirmojo naudingumo lankstumas.
- Potencialiai lemia sunkesnį CS ir ilgesnį pakrovimo laiką.
- Gali apsunkinti siūlų atnaujinimą ir priežiūrą bei jo temas.

***

Santrauka

Grupės juostos sistema ir UI komponentai yra labai integruoti su „uodegos vėjo CSS“, todėl uodegos vėjas yra numatytasis ir rekomenduojama CSS sistema, skirta formuoti gijų temas. Nors techniškai įmanoma naudoti kitas CSS sistemas, tokias kaip „Bootstrap“, „Bulma“, „Fondas“ ar „Materialize“, sukuriant pasirinktines temas ir svarbiausius vaizdus, ​​reikia esminio pritaikymo darbų ir gerai suprasti tiek gijų, tiek alternatyvią sistemą.

Daugeliui kūrėjų, užuot visiškai pakeitę vėją, naudodamiesi plėtiniais ar papildiniais, tokiais kaip „Daisyui“, kurie remiasi „uodegos vėjo CSS“ CSS, siūlo paprastą jų vidurio juostą su išankstiniais komponentais, neprarandant uodegos vėjo pranašumų.

Apibendrinant, nors jūs galite naudoti kitokią CSS sistemą su gijomis, naudodamiesi plačiu pritaikymu, „uodegos vėjas“ išlieka pagrindiniu ir tiesiausiu pasirinkimu plėtojant gijų temą dėl gilios integracijos, pirmojo naudingumo lankstumo ir našumo optimizavimo, pritaikyto siūlų projektavimo sistemai. Jei būtina naudoti kitą sistemą, pasiruoškite reikšmingoms pasirinktinėms plėtros pastangoms pritaikyti gijų UI komponentus ir stilius prie šios sistemos paradigmų.