டைப்ஸ்கிரிப்ட் இறக்குமதியை மேம்படுத்துதல்: மல்டி-லைன் ஃபார்மேட்டிற்காக அழகான மற்றும் ESLint ஐ உள்ளமைத்தல்

டைப்ஸ்கிரிப்ட்டில் இறக்குமதி அறிக்கைகளை நெறிப்படுத்துதல்

பெரிய டைப்ஸ்கிரிப்ட் அல்லது ஜாவாஸ்கிரிப்ட் திட்டங்களில் பணிபுரியும் போது, ​​நீண்ட இறக்குமதி அறிக்கைகளை சந்திப்பது பொதுவானது, குறிப்பாக ஒரு தொகுதியிலிருந்து பல உறுப்பினர்களை இறக்குமதி செய்யும் போது. இந்த வரிகள் ஆரம்பத்தில் பாதிப்பில்லாதவையாகத் தோன்றினாலும், அவை எளிதில் உங்களைத் தாண்டிவிடும் கட்டமைப்பு அமைப்பது, குறியீட்டைப் படிக்கவும் பராமரிக்கவும் கடினமாக்குகிறது.

உங்கள் குறியீட்டை நேர்த்தியாகவும் படிக்கக்கூடியதாகவும் வைத்திருக்க, இந்த இறக்குமதிகளின் வடிவமைப்பை தானியக்கமாக்குவது முக்கியம். போன்ற கருவிகள் மற்றும் தானாக நீண்ட இறக்குமதி அறிக்கைகளை பல வரிகளாக பிரிக்க தனிப்பயனாக்கலாம். நீங்கள் அமைத்துள்ள வடிவமைப்பு விதிகளுக்கு இணங்க, உங்கள் குறியீடு சுத்தமாகவும் சீராகவும் இருப்பதை இது உறுதி செய்கிறது.

இருப்பினும், இறக்குமதி அறிக்கைகளை விரும்பியபடி தானாக வடிவமைக்க இந்தக் கருவிகளை உள்ளமைப்பது தந்திரமானதாக இருக்கும். Prettier மற்றும் ESLint இரண்டின் இயல்புநிலை அமைப்புகளும் பல வடிவமைப்புச் சிக்கல்களைக் கையாளும் அதே வேளையில், பல வரிகளில் உள்ள நீண்ட இறக்குமதி அறிக்கைகளை உடைக்கும்போது அவை பெரும்பாலும் குறைந்துவிடும்.

இந்த வழிகாட்டியில், உங்கள் டைப்ஸ்கிரிப்ட் திட்டத்தில் இறக்குமதி அறிக்கைகளை சரியாக வடிவமைக்க Prettier மற்றும் ESLint ஐ எவ்வாறு கட்டமைப்பது என்பதை ஆராய்வோம். உங்கள் கோட்பேஸ் முழுவதும் நிலைத்தன்மையை பராமரிக்கும் போது பல வரி இறக்குமதிகளை அடைய தேவையான அமைப்புகளை நாங்கள் மேற்கொள்வோம்.

கட்டளை	பயன்பாட்டின் உதாரணம்
prettier.format	கட்டமைக்கப்பட்ட விதிகளின்படி (எ.கா., printWidth, singleQuote) குறியீட்டின் தொகுதியை வடிவமைக்க இந்த Prettier செயல்பாடு பயன்படுத்தப்படுகிறது. இது குறியீட்டின் சரத்தை செயலாக்குகிறது மற்றும் வடிவமைக்கப்பட்ட வெளியீட்டை வழங்குகிறது, இது குறியீட்டு பாணி நிலைத்தன்மையை உறுதி செய்வதற்கு ஏற்றதாக அமைகிறது.
eslint.RuleTester	ESLint க்கு குறிப்பிட்டது, இந்த கட்டளை டெவலப்பர்களை தனிப்பயன் ESLint விதிகளை சோதிக்க அனுமதிக்கிறது. விதி சோதனையாளருக்கு மாதிரிக் குறியீட்டை வழங்குவதன் மூலம், இறக்குமதிகள் பல வரிகளாகப் பிரிக்கப்படுவதை உறுதி செய்வது போன்ற விதிகள் சரியாகச் செயல்படுத்தப்படுகிறதா இல்லையா என்பதை இது சரிபார்க்கிறது.
prettier-plugin-organize-imports	இது தானாக இறக்குமதிகளை ஒழுங்கமைக்க வடிவமைக்கப்பட்ட அழகான செருகுநிரலாகும். இறக்குமதி அறிக்கைகள் வரிசைப்படுத்தப்படுவதையும், பிரிண்ட் விட்த் போன்ற பிரீட்டியர் விதிகளுடன் இணைந்தால், அது பல வரிகளில் நீண்ட இறக்குமதிகளைப் பிரிக்கும்.
jest.describe	தொடர்புடைய சோதனைகளை ஒன்றிணைக்கும் ஒரு ஜெஸ்ட் செயல்பாடு. இந்த சூழலில், ESLint மற்றும் Prettier உள்ளமைவுகள் நீண்ட இறக்குமதி அறிக்கைகளை பல வரிகளாகப் பிரிப்பதன் மூலம் அவற்றைச் சரியாகக் கையாளுகின்றனவா என்பதைச் சரிபார்க்கும் சோதனைகளைக் குழுவாக்குகிறது.
import/order	இது eslint-plugin-import இலிருந்து ஒரு குறிப்பிட்ட ESLint விதியாகும், இது இறக்குமதி அறிக்கைகளின் வரிசையில் ஒரு மாநாட்டை செயல்படுத்துகிறது. வெவ்வேறு இறக்குமதி குழுக்களிடையே (எ.கா., உள்ளமைக்கப்பட்ட, வெளிப்புற தொகுப்புகள்) புதிய வரிகள் சேர்க்கப்படுவதையும் இது செயல்படுத்தலாம்.
alphabetize	இறக்குமதி/ஆர்டர் ESLint விதிக்குள், இறக்குமதி செய்யப்பட்ட உறுப்பினர்கள் அகரவரிசைப்படி வரிசைப்படுத்தப்படுவதை இந்த விருப்பம் உறுதி செய்கிறது. இது குறியீடு வாசிப்பை மேம்படுத்துகிறது, குறிப்பாக பல இறக்குமதிகள் கொண்ட பெரிய திட்டங்களில்.
jest.it	ஒற்றை அலகு சோதனையை வரையறுக்க இந்த ஜெஸ்ட் செயல்பாடு பயன்படுத்தப்படுகிறது. இந்த எடுத்துக்காட்டில், கட்டமைக்கப்பட்ட Prettier மற்றும் ESLint விதிகள் மூலம் நீண்ட இறக்குமதிகள் பல வரிகளாக சரியாகப் பிரிக்கப்பட்டுள்ளதா என்பதை இது சரிபார்க்கிறது.
newlines-between	இறக்குமதி/ஆர்டர் ESLint விதிக்கான உள்ளமைவு விருப்பம். இது இறக்குமதி குழுக்களுக்கு இடையே புதிய வரிகளை கட்டாயப்படுத்துகிறது (எ.கா., வெளி மற்றும் உள் இறக்குமதி), குறியீட்டை மிகவும் கட்டமைக்கப்பட்டதாகவும், எளிதாக செல்லவும் செய்கிறது.

டைப்ஸ்கிரிப்டில் பல-வரி இறக்குமதிகளுக்கு ப்ரீட்டியர் மற்றும் ஈஎஸ்லின்ட் கட்டமைக்கிறது

மேலே உள்ள ஸ்கிரிப்ட்களின் முக்கிய குறிக்கோள் கட்டமைப்பதாகும் மற்றும் TypeScript திட்டத்தில் பல வரிகளில் நீண்ட இறக்குமதி அறிக்கைகளை தானாக வடிவமைக்க. ஒற்றை மேற்கோள்கள் மற்றும் பின்னிணைந்த காற்புள்ளிகள் போன்ற குறியீட்டு பாணிகளை வரையறுக்கவும், குறியீட்டை எவ்வாறு சுற்ற வேண்டும் என்பதை நிர்வகிக்கவும் பிரிட்டியர் உள்ளமைவு அமைக்கப்பட்டுள்ளது. ஆட்சி. கோடு செட் அகலத்தை மீறும் போது (இந்த வழக்கில், 80 அல்லது 120 எழுத்துகள்), Prettier தானாகவே குறியீட்டை மேலும் படிக்கும்படி வடிவமைக்கும். பயன்படுத்துவதன் மூலம் prettier-plugin-organize-imports செருகுநிரல், இறக்குமதி அறிக்கைகள் பிரிக்கப்பட்டு தர்க்கரீதியாக வரிசைப்படுத்தப்படுவதை நாங்கள் உறுதிசெய்கிறோம்.

ESLint கட்டமைப்பில், தி இருந்து ஆட்சி இறக்குமதிகள் எவ்வாறு ஒழுங்கமைக்கப்படுகின்றன என்பதைக் கட்டுப்படுத்த சொருகி அவசியம். வெவ்வேறு குழுக்களில் இருந்து இறக்குமதி செய்யப்படும் (உள்ளமைக்கப்பட்ட தொகுதிகள், வெளிப்புற தொகுப்புகள் மற்றும் உள் தொகுதிகள் போன்றவை) புதிய வரிகளால் பிரிக்கப்பட்ட ஒரு நிலையான இறக்குமதி கட்டமைப்பைச் செயல்படுத்துவதே இங்கு குறிக்கோளாகும். கூடுதலாக, ஒரே குழுவில் உள்ள இறக்குமதிகள் வாசிப்புத்திறனை மேம்படுத்த அகரவரிசைப்படுத்தப்படுகின்றன. இந்த விதிகள், குறிப்பாக பல கோப்புகளிலிருந்து அதிக எண்ணிக்கையிலான இறக்குமதி செய்யப்பட்ட உறுப்பினர்களைக் கையாளும் போது, ​​இறக்குமதிகள் இரைச்சலாக மாறுவதைத் தடுக்கிறது.

ESLint அமைப்பின் மற்றொரு குறிப்பிடத்தக்க அம்சம் விருப்பம், ஒவ்வொரு இறக்குமதி குழுவும் வெற்று வரியால் பிரிக்கப்படுவதை உறுதி செய்கிறது. இது குறியீட்டை மிகவும் பார்வைக்கு ஒழுங்கமைக்கிறது, குறிப்பாக பெரிய குறியீட்டுத் தளங்களில். உடன் இணைந்து விதி, முழு இறக்குமதித் தொகுதியும் கட்டமைக்கப்பட்டு பராமரிக்க எளிதாகிறது. விஷுவல் ஸ்டுடியோ குறியீட்டில் சேமித்ததில் குறியீடு வடிவமைக்கப்படும்போது, ​​இந்த அமைப்புகள் தானாகவே பயன்படுத்தப்படும், கைமுறை சரிசெய்தல் இல்லாமல் முழு திட்டத்திலும் நிலையான இறக்குமதி வடிவமைப்பை உறுதி செய்கிறது.

கடைசியாக, இந்த உள்ளமைவைச் சோதிப்பது, அது சரியாகச் செயல்படுகிறதா என்பதை உறுதிப்படுத்துவது மிக முக்கியமானது. தி பிரிட்டியர் மற்றும் ESLint உள்ளமைவுகள் எதிர்பார்த்தபடி இறக்குமதி பிரித்தல் மற்றும் வடிவமைப்பைக் கையாளுகின்றனவா என்பதைச் சரிபார்க்க அலகு சோதனைகள் வடிவமைக்கப்பட்டுள்ளன. எடுத்துக்காட்டாக, நீண்ட இறக்குமதி அறிக்கை வழங்கப்பட்டால், அது பல வரிகளாகப் பிரிக்கப்பட்டுள்ளதா என்பதைச் சோதனை சரிபார்க்கிறது. இந்த அணுகுமுறை டெவலப்பர்கள் தங்கள் வடிவமைப்பு விதிகளின் சோதனையை தானியக்கமாக்க அனுமதிக்கிறது, எதிர்காலத்தில் ஏதேனும் குறியீடு மாற்றங்கள் அதே இறக்குமதி கட்டமைப்பு வழிகாட்டுதல்களுக்கு இணங்குவதை உறுதி செய்கிறது.

module.exports = {
  semi: false,
  singleQuote: true,
  trailingComma: 'all',
  printWidth: 80,
  plugins: ['prettier-plugin-organize-imports'],
}
// Prettier configuration setup for import splitting

module.exports = {
  "extends": ["eslint:recommended", "plugin:import/errors", "plugin:import/warnings"],
  "rules": {
    "import/order": [
      "error", {
        "groups": ["builtin", "external", "internal"],
        "newlines-between": "always",
        "alphabetize": { "order": "asc", "caseInsensitive": true }
      }],
    "max-len": ["error", { "code": 80 }],
  }
}
// ESLint rule setup to organize imports into multiple lines and ensure alphabetical order

import {
  longFunctionNameOne,
  longFunctionNameTwo,
  longFunctionNameThree
} from '@example/long-module-name';

import {
  shortFunctionNameOne,
  shortFunctionNameTwo
} from '@example/short-module-name';
// Example of formatted import statements following the configured rules

const eslint = require('eslint');
const prettier = require('prettier');
const { describe, it } = require('@jest/globals');

describe('Import Formatting', () => {
  it('should split long imports into multiple lines', () => {
    const code = `import { a, b, c, d } from '@example/package';`;
    const formatted = prettier.format(code, { printWidth: 80 });
    expect(formatted).toMatch(/import { a, b }/);
  });
});
// Unit test to check if long imports are split into multiple lines using Jest

Prettier மற்றும் ESLint Import Formatting மூலம் குறியீடு படிக்கக்கூடிய தன்மையை மேம்படுத்துகிறது

பெரிய குறியீட்டுத் தளங்களைக் கையாளும் போது, ​​குறியீட்டு வாசிப்புத்திறன் மற்றும் குழு ஒத்துழைப்பை மேம்படுத்துவதற்கு நிலையான இறக்குமதி கட்டமைப்புகளை பராமரிப்பது முக்கியமானது. டெவலப்பர்கள் எதிர்கொள்ளும் ஒரு பொதுவான சிக்கல் என்னவென்றால், இறக்குமதி அறிக்கைகள் கோப்பின் மேற்பகுதியை எவ்வளவு நேரம் ஒழுங்கீனம் செய்யலாம், குறிப்பாக அவை ஒரு தொகுதியிலிருந்து பல கூறுகளைக் கொண்டிருக்கும்போது. கருவிகள் விரும்பும் இடம் இது மற்றும் செயல்பாட்டுக்கு வந்து, நீங்கள் பல வரிகளில் இறக்குமதிகளை பிரிப்பதை தானியங்குபடுத்த அனுமதிக்கிறது. இறக்குமதி அறிக்கைகள் வரையறுக்கப்பட்ட அகலத்திற்கு இணங்குவதை உறுதி செய்தல், பொதுவாக அடிப்படையில் அமைப்பது, கிடைமட்ட ஸ்க்ரோலிங் செய்வதைத் தடுக்க உதவுகிறது மற்றும் குறியீட்டை ஸ்கேன் செய்வதை எளிதாக்குகிறது.

மற்றொரு முக்கியமான அம்சம், இறக்குமதியின் நிறுவன வடிவமாகும். பயன்படுத்தி ESLint வழங்கிய விதி, நீங்கள் இறக்குமதிகளை அவற்றின் தோற்றத்தின் அடிப்படையில் குழுவாக்கலாம்: உள்ளமைக்கப்பட்ட நூலகங்கள், மூன்றாம் தரப்பு சார்புகள் அல்லது உள் தொகுதிகள். இந்தக் குழுக்களை புதிய வரிகளால் பிரிக்கலாம், டெவலப்பர்கள் சார்புகளை விரைவாகக் கண்டறிவதை எளிதாக்குகிறது. இந்த முறை கட்டமைக்கப்பட்ட இறக்குமதிகளை ஊக்குவிக்கிறது, இது அகரவரிசைப்படி வரிசைப்படுத்துதலுடன் இணைந்தால் விருப்பம், குறியீட்டு தளத்தில் தெளிவு மற்றும் நிலைத்தன்மையை மேலும் மேம்படுத்துகிறது.

கூடுதலாக, டெவலப்பர்கள் போன்ற கருவிகளைப் பயன்படுத்த விரும்பலாம் இறக்குமதிகள் சரியாகப் பிரிக்கப்படுவது மட்டுமல்லாமல், தர்க்கரீதியாக மறுசீரமைக்கப்படுவதையும் உறுதி செய்ய. விஷுவல் ஸ்டுடியோ கோட் போன்ற எடிட்டரில் கோப்பு சேமிக்கப்படும் ஒவ்வொரு முறையும் இந்த கருவிகள் விரும்பிய இறக்குமதி கட்டமைப்பை தானாகவே செயல்படுத்தும். டெவலப்பர்கள் இறக்குமதி அறிக்கைகளை கைமுறையாக சரிசெய்ய வேண்டியதில்லை என்பதை இது உறுதிசெய்கிறது மற்றும் தூய்மையான மற்றும் பராமரிக்கக்கூடிய குறியீட்டை எழுதுவதில் கவனம் செலுத்த முடியும்.

1. எது சிறந்தது இறக்குமதியை ஒழுங்கமைப்பதற்கான விதி?
2. தி இருந்து ஆட்சி இறக்குமதியை ஒழுங்கமைக்க ஏற்றது. இது உங்களை குழுவாக்கவும், வரிசைப்படுத்தவும் மற்றும் இறக்குமதிகளை தொடர்ந்து கட்டமைக்கவும் அனுமதிக்கிறது.
3. இறக்குமதி அறிக்கைகளைப் பயன்படுத்தி பல வரிகளாகப் பிரிக்க முடியுமா? தனியாகவா?
4. பிரிட்டியர் நீண்ட இறக்குமதி அறிக்கைகளை பல வரிகளாக பிரிக்கலாம் விதி மீறப்பட்டுள்ளது. இருப்பினும், அதை ESLint உடன் இணைப்பது கூடுதல் தனிப்பயனாக்கலை வழங்குகிறது.
5. என்ன செய்கிறது விருப்பம் செய்யவா?
6. தி விருப்பம் உள்ள இறக்குமதி உறுப்பினர்கள் மற்றும் அறிக்கைகள் அகரவரிசைப்படி வரிசைப்படுத்தப்படுவதை உறுதிசெய்கிறது, குறியீடு வாசிப்புத்தன்மையை மேம்படுத்துகிறது.
7. சேமிப்பில் எனது இறக்குமதிகள் தானாக வடிவமைக்கப்படுவதை எப்படி உறுதி செய்வது?
8. இரண்டையும் உறுதிப்படுத்திக் கொள்ளுங்கள் மற்றும் உங்கள் எடிட்டரில் சேமித்து இயக்கும்படி கட்டமைக்கப்பட்டுள்ளன, பொதுவாக உள்ள அமைப்புகளின் மூலம் அல்லது ஒத்த IDEகள்.
9. ஏன் பயன்படுத்த வேண்டும் ?
10. இந்தச் செருகுநிரல், இறக்குமதிகள் பல வரிகளில் பிரிக்கப்படுவதை மட்டுமல்லாமல், தர்க்கரீதியாக வரிசைப்படுத்தப்பட்டு தொகுக்கப்படுவதை உறுதிசெய்கிறது, மேலும் குறியீடு பராமரிப்பை மேம்படுத்துகிறது.

இறக்குமதி அறிக்கைகளை தானாக வடிவமைப்பதற்காக Prettier மற்றும் ESLint ஐ அமைப்பது உங்கள் திட்டத்தின் பராமரிப்பை மேம்படுத்துவதற்கான ஒரு சக்திவாய்ந்த வழியாகும். நீண்ட இறக்குமதிகள் பிரிக்கப்பட்டு, வரிசைப்படுத்தப்பட்டு, தர்க்கரீதியாக ஒழுங்கமைக்கப்படுவதை இது உறுதி செய்கிறது.

இந்த கருவிகளை செருகுநிரல்களுடன் இணைப்பதன் மூலம், உங்கள் டைப்ஸ்கிரிப்ட் கோப்புகள் முழுவதும் நிலைத்தன்மையை உறுதிசெய்கிறீர்கள். இது குறியீட்டை சுத்தமாக வைத்திருப்பது மட்டுமல்லாமல், இறக்குமதி அமைப்பு சீராக இருப்பதால் உங்கள் குழுவில் ஒத்துழைப்பை மேம்படுத்துகிறது.