Ushbu vositalar sizga toza kodni yozishga yordam beradi

Prettier, ESLint, Husky, Lint-Staged va EditorConfig-ga qarash

Marko Xu surati Unsplash-da

Yaxshi kod yozishni o'rganish, lekin qaerdan boshlash kerakligini bilmayapsizmi ... Airbnb-ning Javascript uslubi qo'llanmasi kabi uslublar bo'yicha qo'llanmalarni ko'rib chiqing ... Eng yaxshi amaliyotlar bilan kod yozishga urinmoqdasiz ...

O'lik kodni olib tashlamoqchimisiz? Kod bazasida foydalanilmagan o'zgaruvchilarni topish? Kodingizda muammoli naqshlarni topishga harakat qilyapsizmi? Xuddi, u qaytadimi yoki yo'qmi?

Bu biron bir tanish ovoz bormi?

Barchasini bir vaqtning o'zida o'rganish va bajarish uchun juda ko'p narsa, shunchaki o'ta og'ir.

Siz turli guruhlarni boshqaradigan guruh etakchisiz? Jamoada yangi ishlab chiquvchilar bormi? Ular kodni standartga mos kelmaydi deb tashvishlanyapsizmi? Bu butun kuningizni kod sharhlarida o'tkazadimi, bu erda ko'rib chiqish ko'proq kod standartlariga emas, balki haqiqiy mantiqqa bog'liqmi?

Men u erda bo'lganman va shunday qildim va bu juda charchagan va og'ir.

Kod qanday ko'rinishi haqida qayg'urmasligingiz yoki butun jamoangizga qandaydir tarzda to'g'ri yozilgan va to'g'ri formatlangan tarzda yozilishi kerakligini va'da qilaylik.

Ushbu dars davomida agar siz qoqilib qolsangiz, mana bu erda kodlar ombori joylashgan. Agar sizda yaxshilanish bo'yicha takliflar bo'lsa, tortish so'rovlari qabul qilinadi.

Ushbu qo'llanma React amaliy dasturlariga ko'proq e'tibor qaratadi, ammo xuddi shu narsani har qanday veb-loyihada qo'llash mumkin.

Shuningdek, men ushbu darslik uchun foydalanadigan muharrir - VS Code. Bu Microsoft tomonidan va ular ochiq manbaga aylanganlaridan beri, men ushbu kompaniyada ❤da bo'lganman (garchi men bo'lmagan paytlar ham bo'lgan).

Kun tartibi

  • Yoqimli
  • ESLint
  • Saqlashda formatlash va chiziqlarni avtomatlashtirish
  • Husky
  • Lint bosqichida
  • Husky va Lint pog'onali kombinatsiyalangan
  • EditorConfig

Prettierdan boshlaylik

Prettier nima?

Prettier - bu kodni formatlashtiruvchi mulohazadir. U siz uchun kodni ma'lum bir shaklda formatlaydi.

GIF buni juda ko'p tushuntiradi:

Boss kabi mening kodimni formatlash juda yaxshi!

Bizga nima kerak?

  • Mavjud kodlar bazasini tozalaydi: bitta buyruq satrida. Tasavvur qiling, 20000 tadan ortiq kodli kod bazasini tozalash.
  • Qabul qilish oson: Prettier kodingizni formatlashda eng kam bahsli kodlash uslubidan foydalanadi. Ochiq manbali bo'lganligi sababli, ko'plab odamlar ba'zi ishlarni tuzatish va tajribani jilo qilishda bir nechta iteratsiyalar ustida ishladilar.
  • Yozish kodi: Odamlar ko'p vaqtni kodni formatlash va aqliy energiya sarflash bilan sarflashlarini anglamaydilar. Prettier-ga asosiy biznes mantig'iga e'tibor qaratgan holda uni hal qilishga ruxsat bering. Shaxsiy yozuvda Prettier mening samaradorligimni 10 foizga oshirdi.
  • Newbie dasturchilariga yordam berish: Agar siz buyuk muhandislar bilan yonma-yon ishlaydigan yangi ishlab chiquvchi bo'lsangiz va yozuvingizni toza kod bilan ko'rishni istasangiz, aqlli bo'ling! Prettier-dan foydalaning.

Uni qanday o'rnataman?

Ilova deb nomlangan papkani yarating va buyruq satrida ushbu jild turiga kiring:

ngm tashabb -y

Bu sizga ilova papkasida pack.json faylini yaratadi.

Endi men ushbu dars davomida ipni ishlatmoqchiman, lekin siz ham npm-dan foydalanishingiz mumkin.

Birinchi qaramligimizni o'rnataylik:

ip qo'shing - dev chiroyli

Bu sizning pack.json-ga qo'shimcha qaramlikni o'rnatadi, u quyidagicha ko'rinishga ega bo'ladi:

Men bir zumda bu "afzalroq" ni aytaman: "afzalroq - src / ** / *. Js" yozing, lekin avval dastur papkamizda src / papka yarataylik. Va src / papkaning ichida index.js deb nomlangan fayl yarataylik - xohlaganingizga qo'ng'iroq qilishingiz mumkin.

Index.js faylida ushbu kodni shunday joylashtiring:

Xullas, bizda src / app / index.js fayli mavjud bo'lib, unda yomon kodlar yozilgan.

Bu borada 3 narsani qilishimiz mumkin:

  • Ushbu kodni qo'lda kiriting va formatlang
  • Avtomatlashtirilgan vositadan foydalaning
  • Ishlar davom etaveradi (iltimos, bu variantni tanlamang)

Men ikkinchi variantga boraman. Endi bizda qaramlik o'rnatilgan va bizning pack.json-da Prettier skriptimiz mavjud.

Ilovaning ilova dastur papkasida prettier.config.js faylini yaratamiz va unga ba'zi yaxshi qoidalarni qo'shamiz:

printWidth sizning kodingiz 100 belgidan oshmasligi kerak.

singleQuote sizning barcha qo'shtirnoqlarni bitta qo'shtirnoqqa aylantiradi.
Batafsil ma'lumotni Airbnb JavaScript Style qo'llanmasida o'qing. Ushbu qo'llanma yaxshi kod yozish va hamkasblarimni hayratda qoldirish uchun mening darsligim.

trailingComma oxirgi ob'ekt xususiyatining oxirida siljigan vergul borligini ta'minlaydi. Nik Graf buni juda ajoyib tarzda tushuntiradi.

bracketSpacing ob'ekt harflari orasidagi bo'shliqlarni bosib chiqaradi:

Agar bracketSpacing to'g'ri bo'lsa - Masalan: {foo: bar}
Agar bracketSpacing noto'g'ri bo'lsa - Masalan: {foo: bar}

jsxBracketSameLine> ko'p qatorli JSX elementni oxirgi qatorga qo'yadi:

tabWidth bo'shliqlar sonini belgilaydi.

agar true bo'lsa, yarim; oxirida bayonotlar.

Prettier-ga beradigan barcha variantlarning ro'yxati.

Endi biz konfiguratsiyani o'rnatdik, keling ushbu skript haqida gaplashaylik.

"Afzalroq": "chiroyli - src / ** / *. Js yozish"

Yuqoridagi skriptda men juda yaxshi ishlayapman va unga mening barcha src / papkamdagi barcha .js fayllarni topishini aytaman. - Write bayrog'i, har bir fayl orqali o'tib, kod shakllanishida biron bir anomaliya topganda formatlangan fayllarni saqlashni afzalroq deb aytadi.

Ushbu skriptni terminalingizda ishlataylik:

ipni chiroyli qilish

Kodni ishga tushirganimda shunday bo'ladi:

Salqin, to'g'rimi?

Agar siz qoqilib qolsangiz, bu uchun omborni ko'rib chiqishga bepul yordam bering.

Bu bizning Prettier munozaramizni nihoyasiga etdi. Linters haqida gapiraylik.

ESLint

Kod liniyasi nima?

Kod belgisi - bu muayyan uslub qoidalariga rioya qilmaydigan muammoli naqshlarni yoki kodni topish uchun tez-tez ishlatiladigan statik tahlilning bir turi. Ko'pgina dasturlash tillari uchun kod liniyalari mavjud va kompilyatorlar ba'zida kompilyatsiya jarayoniga astarlarni kiritishadi. - ESLint

Nima uchun bizga JavaScript kerak?

JavaScript dinamik va erkin yozilgan til bo'lganligi sababli, dasturchi xatolariga moyil bo'ladi. Kompilyatsiya jarayonining foydasini olmasdan .js fayllari odatda sintaksis yoki boshqa xatolarni topish uchun bajariladi.

ESLint kabi linting vositalari ishlab chiquvchilarga JavaScript kodlari bilan ishlamay turib muammolar topishga imkon beradi.

Nima ESLintni shu qadar maxsus qiladi?

Yaxshi savol! ESLint-da hamma narsa ulanishi mumkin. Siz ish vaqti vaqtida qoidalarni qo'shishingiz mumkin - ulardan foydalanish uchun qoidalar va formatlovchilar to'plami shart emas. Siz qo'shgan har bir tinting qoidasi yolg'iz, har qanday qoida yoqilishi yoki o'chirilishi mumkin. Har bir qoida ogohlantirish yoki xato uchun o'rnatilishi mumkin. Sizning tanlovingiz.

ESLint-dan foydalanib, siz o'zingizning uslublar bo'yicha qo'llanmangiz qanday ko'rinishini xohlashingizni to'liq moslashtirishga erishasiz.

Hozirda ikkita mashhur uslub qo'llanmasi mavjud:

  • Google JavaScript uslubiy qo'llanmasi
  • Airbnb JavaScript uslubiy qo'llanmasi

Men shaxsan Airbnb uslubi qo'llanmasidan foydalanganman. Menga mening kasbiy faoliyatimni boshlaganimda, oxirgi firmada muhandislik rahbari tomonidan tavsiya etilgan va bu mening ixtiyorimdagi eng qimmatli narsadir.

Ushbu uslubiy qo'llanma faol ravishda saqlanadi - ularning GitHub repolarini tekshiring. Ushbu qo'llanmada men Airbnb's Style Guide-dan ilhomlangan qoidalar to'plamidan foydalanaman. Shunday qilib, boshlaylik.

Avvalo pack.json faylimizni yangilaylik:

Konfiguratsiya bilan oldinga borishdan oldin, odamlar o'zlarining qaramliklariga nima kirishini bilib olishlari kerakligiga ishonaman. Keling, ushbu paketlarning har biri nimani amalga oshirishi haqida gapiraylik va keyin biz konfiguratsiyalar bilan oldinga siljiy olamiz.

babel-eslint: ushbu to'plam sizga Babelning barcha yaxshiliklarida osongina ishlatishingiz mumkin. Agar siz oqim yoki ekspluatatsion xususiyatlardan foydalanmasangiz, ESLint tomonidan qo'llab-quvvatlanmaydigan bo'lsangiz, bu plaginni sizga kerak emas.

eslint: bu sizning kodingizni kiritish uchun zarur bo'lgan asosiy vositadir.

eslint-config-airbnb: ushbu to'plam Airbnb-ning barcha ESLint konfiguratsiyasini siz o'zgartirishingiz mumkin bo'lgan kengaytirilgan umumiy konfiguratsiya sifatida taqdim etadi.

eslint-plagin-babel: bab-eslint-ga eslint plagin hamrohidir.
babel-eslint eslabintni Babel bilan ishlashga moslashtirishda juda yaxshi ish qiladi.

eslint-plugin-import: Ushbu plagin ES2015 + (ES6 +) import / eksport sintaksisini saralashni qo'llab-quvvatlaydi va fayl yo'llarini va nomlarni noto'g'ri yozishda muammolarni oldini oladi. Ko'proq o'qing.

eslint-plugin-jsx-a11y: kirish qoidalarini JSX elementlarida o'rnatish qoidalari. Chunki kirish muhim!

eslint-plugin-prettier: Bu ESLint-ga Prettier bilan muammosiz ishlashga yordam beradi. Shunday qilib Prettier kodni formatlashtirganda, bu bizning ESLint qoidalarini yodda tutadi.

eslint-plagin-reaktsiya: ESLint uchun reaktsiyaga asoslangan linting qoidalari.

Endi ushbu darslik Jest / Enzyme uchun birliklarni sinash haqida ko'p gapirmaydi. Ammo agar siz foydalanayotgan bo'lsangiz, ularga ham qoidalar qo'shing.

eslint-config-jest-ferment: Bu globallashgan Reakt- va fermentga xos o'zgaruvchilarga yordam beradi. Ushbu lint sozlamasi ESLint-ga o'sha globallar to'g'risida ma'lumot berishga va ular haqida ogohlantirmaslikka imkon beradi - bu tasdiqlash va tavsiflash kabi.

eslint-plugin-jest: Jest uchun ESLint plaginlari.

husky: Bu haqda keyinroq avtomatlashtirish bo'limida.

pog'onali: Bu haqida keyinroq avtomatlashtirish bo'limida.

Endi biz asosiy tushunchaga egamiz, boshlaylik;

Ildiz ilovangiz / papkangizda .eslintrc.js faylini yarating:

Ilova / katalogingizga .eslintignore faylini qo'shing:

Keling, .eslintrc.js fayli qanday ishlashini muhokama qilaylik.

Buni buzib tashlaymiz:

modul.exports = {
   env: {},
   kengayadi: {},
   plagin: {},
   tahlil qiluvchi: {},
   parserOptsiyalar: {},
   qoidalar: {},
};
  • env: Atrof-muhit oldindan belgilangan global o'zgaruvchilarni belgilaydi. Mavjud muhit - bizning holatimizda bu es6, brauzer va tugun.
    es6 modullardan tashqari barcha ECMAScript 6 xususiyatlarini faollashtiradi (avtomatik ravishda ecmaVersion tahlil qilish parametrini 6 ga o'rnatadi).
    brauzer Windows kabi barcha global o'zgaruvchilarni qo'shadi.
     tuguniga global kabi Node global o'zgaruvchilar va Node miqyosi qo'shiladi. Atrof-muhitni aniqlash haqida ko'proq ma'lumot olishingiz mumkin.
  • cho'zilgan: qatorlar qatori - har bir qo'shimcha konfiguratsiya oldingi konfiguratsiyalarni kengaytiradi.
    Hozir biz airbnb tomonidan tintish qoidalaridan foydalanmoqdamiz, ular hazilga va keyin jest-fermentga tegishli.
  • plaginlar: plaginlar asosan biz foydalanmoqchi bo'lgan tartiblash qoidalari.
    Hozir biz babel, import, jsx-a11y, reaktsiya, chiroyli, yuqorida aytib o'tganimdan foydalanmoqdamiz.
  • tahlil qiladi: Sukut bo'yicha ESLint Espree-ni ishlatadi, ammo biz babeldan foydalanganimiz sababli Babel-ESLint-dan foydalanishimiz kerak.
  • parserOptions: Biz Espree-ning standart sintaktik tahlilini babel-eslint-ga o'zgartirganda, biz parserOptions-ni ko'rsatishimiz kerak - bu talab qilinadi.
    Variantlarda men ESLint-ga aytamanki, ecmaVersion 6-versiyani oladi, chunki biz kodni EcmaScript modulida yozyapmiz va skript emas, balki modul sifatida SourceType-ni belgilaymiz.
    Biz JSX-ga olib keladigan React-dan foydalanayotganligimiz sababli, ecmaFeature-da men jsx-ni tanlab, uni haqiqatga o'tkazaman.
  • qoidalar: Bu men eng yaxshi ko'radigan qism ESLint, sozlash.
    Biz plaginlarimiz bilan qo'shgan va qo'shgan barcha qoidalarni o'zgartirishimiz yoki bekor qilishimiz mumkin. qoidalar - buni bajaradigan joy. Men allaqachon Gistda har bir qoidaga qarshi va sizning tushunishingiz uchun sharhlar qo'yganman.

Endi tozalandi, .eslintignore haqida gapiraylik

.eslintignore biz ESLint so'nmasligini xohlagan yo'llar ro'yxatini oladi. Bu erda men faqat uchta narsani ko'rsataman:

  • /.git Men Git-ga tegishli fayllarim asralishini istamayman.
  • /.vscode Men VS kodini ishlatayotganim sababli, ushbu muharrir har bir loyiha uchun sozlashingiz mumkin bo'lgan o'z konfiguratsiyasini taqdim etadi. Men konfiguratsiyalarim (fayllarim) astarlanishini xohlamayman. Men VS kodini ishlataman, chunki u engil va ochiq manba.
  • node_modules Men o'zimning qaramligim birlashtirilishini xohlamayman. Shuning uchun men buni ro'yxatga qo'shdim.

Endi biz shu bilan ishladik, endi pack.json-ga yangi qo'shilgan skriptlar haqida gaplashaylik

"lint": "eslint --debug src /"
"lint: yozish": "eslint --debug src / --fix"
  • Ushbu buyruq bilan ishlaydigan $ ip ipli, bu sizning barcha fayllaringizni src / ichida amalga oshiradi va har bir faylda xatolarni aniqlagan jurnalga ma'lumot beradi, keyin ularni qo'lda kiritib, tuzatishingiz mumkin.
ishlaydigan iplar lint | npm yugurish liniyasi
  • $ ip ip lint: buyruqni ishga tushirishni yozing, u yuqoridagi buyruq bilan bir xil bo'ladi. Faqatgina qo'shimcha shundan iboratki, agar u biron bir xatoni tuzatsa, ularni tuzatadi va imkon qadar ko'proq kod hididan olib tashlashga harakat qiladi.

Agar siz qoqilib qolsangiz, bu uchun omborni ko'rib chiqishga bepul yordam bering.

Bu biroz og'ir edi va agar shu paytgacha kuzatgan bo'lsangiz:

Professor Sneg siz bilan faxrlanadi. Juda yaxshi.

Keling, biroz ko'proq avtomatlashtiraylik

Hozircha biz chiroyli va eslintni o'rnatdik, lekin har safar skriptni ishlatishimiz kerak. Biror narsa qilaylik.

  • Tahrirlovchingizda Ctrl + s tugmalarini bosish uchun Format va Lint Code.
  • Kodingizni har safar kiritganingizda, avtomatik ravishda kodni formatlaydigan va oldindan formatlaydigan buyruqni bajaring.

Saqlash bo'yicha format va chiziq kodi

Buning uchun siz VS Code kabi muharrirdan foydalanishingiz kerak:

  • ESLint kengaytmasi deb nomlangan plaginni o'rnating.
    VS Code muharririda bu yerdan yuklab oling yoki ctrl + shift + x tugmalarini bosing. Bu kengaytmalar modulini ochadi. U erda eslint qidiruv turi. Plaginlar ro'yxati paydo bo'ladi. Uni Dirk Baeumer o'rnatib qo'ying. O'rnatilganidan keyin muharriringizni qayta ishga tushirish uchun "Qayta yuklash" tugmasini bosing.

Ushbu plaginni o'rnatganingizdan so'ng, root ilovangizda / papkangizda .vscode / nomli papka yarating - fayl nomida (nuqta) muhim ahamiyatga ega.

Papka ichida settings.json faylini quyidagicha yarating:

  • editor.formatOnSave Men bu erda noto'g'ri qiymatni o'rnatdim, chunki men fayl formati uchun standart muharrir konfiguratsiyasi ESLint va Prettier bilan zid kelishini istamayman.
  • eslint.autoFixOnSave Men bu erda haqiqiy qiymatni o'rnatdim, chunki men har safar tegib turganda plagin ishlashini xohlayman. ESLint Prettier konfiguratsiyasi bilan konfiguratsiya qilinganligi sababli uni har bosganingizda kodingizni formatlaydi va ushlab turadi.

Shuni ham ta'kidlash kerakki, skriptni ishga tushirganda
ipli lint: endi yozing, u xuddi o'sha yo'lda sizning kodingizni o'zgartiradi va o'zgartiradi.

Tasdiqlash va takomillashtirish uchun 20k kodli kod bazasini qaerga topshirganingizni tasavvur qiling. Endi buni qo'lda qilishni tasavvur qiling. Noma'lum kodni takomillashtirish. Endi buni bitta buyruq bilan bajarishni tasavvur qiling. Qo'lda yondoshish 30 kunni olishi mumkin ... avtomatik yondashish esa 30 soniyani oladi.

Shunday qilib, skriptlar o'rnatildi va siz har safar muharrirni bosganingizda siz aniq bir fayl uchun sehrni yaratasiz. Ammo sizning jamoangizdagi hamma ham VS kodini tanlamaydi va bu yaxshi. Shunday qilib, keling, biroz ko'proq avtomatlashtiraylik.

Husky

Xiralik nima?

Husky asosan sizga ruxsat berishga ruxsat bering. Buning ma'nosi shundaki, siz biron bir harakatni amalga oshirmoqchi bo'lganingizda yoki kodni filialga o'tkazmoqchi bo'lganingizda bajarishingiz mumkin.

Husky-ni o'rnatish kifoya:

ip qo'shing - huska

va pack.json faylingizda parchani qo'shing:

"husky": {
   "ilgaklar": {
     "oldindan ogohlantirish": "YOUR_COMMAND_HERE",
     "oldinga surish": "YOUR_COMMAND_HERE"
   }
},

Shunday qilib, har safar yoki har safar bosganingizda, u biron bir skript yoki buyruqni bajaradi - masalan, sinov holatlari yoki kodingizni formatlash.

Husky haqida ko'proq ma'lumotni bu erda o'qishingiz mumkin.

Lint bosqichida

Lint bosqichli nima?

Lint-staged-da sizga yomon kod sizning filialingizga tushmasligi uchun bosqichli fayllarda linters ishlashga yordam beradi.

Nima uchun Lint-sahna?

Kodni ishlatishdan oldin chop etish ko'proq ma'noga ega. Shunday qilib, siz biron bir xato omborga tushmasligini va kodlar uslubini kuchaytirilishini kafolatlashingiz mumkin. Ammo butun loyihada lintli jarayonni bajarish juda sekin va tint natijalar ahamiyatsiz bo'lishi mumkin. Oxir oqibat, siz faqat bajariladigan fayllarni ajratib olishni xohlaysiz.

Ushbu loyiha o'z ichiga ixtiyoriy qobiq vazifalarini bajaradigan skriptni o'z ichiga oladi va belgilangan glob naqshida filtrlangan argument sifatida fayllarni ro'yxati keltirilgan. Siz bu erda ko'proq o'qishingiz mumkin.

Faqatgina Lint bosqichli dasturini o'rnatish kerak:

ip qo'shing - ipli-bosqichli

keyin pack.json faylingizda buni qo'shing:

"lint-staged": {
   "*. (js | jsx)": ["npm yugurish: yozish", "qo'shing"]
},

Bu buyruq bajaradigan narsa bu lintni ishga tushirish: avval buyruqni yozing va keyin sahna maydoniga qo'shing. Bu buyruq faqat .js & .jsx fayllari uchun ishlaydi, lekin agar xohlasangiz, boshqa fayllar uchun ham shunday qilishingiz mumkin.

Husky va Lint-staged bilan birgalikda

Kodingizni har safar qilganingizda, kodni bajarishdan oldin, u npm run lint ishlaydigan lint-staged deb nomlangan skriptni ishlaydi: kodni o'chirib formatlaydigan yozing - keyin uni sahnaga qo'shing va keyin bajaring. Salqinmi ?!

Sizning oxirgi pack.json faylingiz quyidagicha ko'rinishi kerak. Bu men yuqorida aytib o'tgan o'sha parcha:

Endi har safar buni qilganingizda:

$ git qo'shing.
$ git spread -m "bu erda ba'zi bir tavsifli xabar"

U kodda ko'rsatilgan barcha qoidalarga asoslangan holda tartiblanadi va formatlanadi
.eslintrc.js fayli. Bunda hech qanday yomon kod ishlab chiqarishga olib kelmasligiga amin bo'lishingiz mumkin.

Ushbu bo'lim tugagandan so'ng, siz o'zingizning kod bazangizda yanada chiroyli, eslint va husklarni birlashtirasiz.

EditorConfig haqida gapiraylik

Avval o'zingizning ilova dastur / papkangizda .editorconfig faylini yarating va shu faylga quyidagi kodni qo'ying:

Xo'sh, EditorConfig nima?

Shunday qilib, hamma ham VS kodni ishlatishni istamaydi - va siz ham uni amalga oshira olmaysiz, ham kerak emas. Barchani bitta sahifada saqlash uchun, masalan, tab maydoni yoki satrning oxiri kabi standartlarni tanlash uchun biz foydalanamiz.
.editorconfig. Bu aslida ba'zi bir qoidalar to'plamini bajarishga yordam beradi.

Mana EditorConfig-ni qo'llab-quvvatlaydigan barcha muharrirlarning ro'yxati. Tahrirlovchilar ro'yxatiga Web bo'roni, App kod, Atom, tutilish, emacs, bbedit va boshqalar kiradi.

Yuqoridagi konfiguratsiya quyidagilarni bajaradi:

  • .md & .js fayllaridan oq bo'shliqlarni qirqish
  • yorliq o'rniga oddiy joyni belgilash
  • indeks hajmi 2 ga
  • Operatsion tizimidan qat'i nazar, har bir kishi chiziqning oxirida bir xil bo'lishi uchun chiziqning oxiri lf bo'lishi kerak. Batafsil bu erda.
  • fayl oxirida yangi qator bo'lishi kerak
  • va maksimal chiziq uzunligi 100 ta sim bo'lishi kerak

Ushbu konfiguratsiyaning barchasi bajarilgan va hozirda siz tayyor. Agar siz manba kodini ko'rishni istasangiz, bu erda.

Agar siz ushbu omborda biron bir narsani yaxshilay olishingizni xohlasangiz, tortish so'rovlari qabul qilinadi.

Agar siz mening maqolamni yoqtirgan bo'lsangiz, mening boshqa maqolamni ham tekshirib ko'ring: veb-paket va Babel 7-ni qanday qilib birlashtirish kerak, men ajoyib reaktiv ilovasini yarataman, unda men Webpack va Babel-ni sozlash haqida gaplashaman.