नवीनतम प्रौद्योगिकी पुस्तकालय बनाएँ

हाय, हैब्र। यह लेख नवीनतम तकनीक के साथ हैलो दुनिया लिखने के तरीके के बारे में है।

अंत में, हमें एक हैलो वर्ल्ड लाइब्रेरी मिलेगी जो:

• टाइपस्क्रिप्ट का उपयोग करता है
• कोडस्टाइल की देखभाल करता है
• एक गोदी उत्पन्न करता है
• परीक्षण आयोजित करता है

शुरू कर दिया

नए फ़ोल्डर में, git और npm आरंभ करें

git init npm init 

जब npm की स्थापना

  package name: (bestlibever) version: (1.0.0) 0.1.0 description: Best lib forever entry point: (index.js) test command: jest git repository: keywords: author: >MAX_ (maximmasterr) license: (ISC) MIT 

परियोजना की संरचना

परियोजना में निम्नलिखित निर्देशिकाएँ होंगी:

• src - यहां लाइब्रेरी की फाइलें खुद होंगी (टाइपस्क्रिप्ट)
• lib - यहाँ tsc संकलित फाइलों को src से डालेगा
• परीक्षण - यहाँ परीक्षण हैं
• उदाहरण - उपयोग के उदाहरण

आपको .gitignore को भी जोड़ना होगा:

 lib/ node_modules/ 

टाइपप्रति

अब टाइपस्क्रिप्ट स्थापित और कॉन्फ़िगर करें:

 npm i typescript -D 

और tsconifg.json नामक एक फाइल tsconifg.json

  { "compilerOptions": { "target": "es5", "module": "commonjs", "declaration": true, "outDir": "./lib", "strict": true, "sourceMap": true }, "include": ["src"], "exclude": ["node_modules", "**/__tests__/*"] } 

अब मुख्य फाइल को src/index.ts

 export function helloWorld(){ return 'Hello world!' } 

इसके अलावा स्क्रिप्ट को package.json जोड़ें:

  "build": "tsc", "dev": "tsc --watch" 

अब हम एक-बार निर्माण का उपयोग करके चला सकते हैं:

 npm run build 

और पुन: प्रयोज्य:

 npm run dev 

Codestyle

कोड शैली का परीक्षण करने के लिए, हम tslint और prettier का उपयोग करेंगे, साथ ही इसे कमिट करने से पहले चलाएंगे।
Tslint, prettier, कर्कश स्थापित करें:

 npm i tslint tslint-config-prettier prettier husky -D 

सामग्री के साथ एक .prettierrc फ़ाइल बनाकर .prettierrc कॉन्फ़िगर करें

 { "printWidth": 120, "trailingComma": "none", "singleQuote": true } 

प्रीटियर चलाने के लिए स्क्रिप्ट जोड़ें

  "prettier": "npx prettier --write src/* test/* example/*" 

सामग्री के साथ tslint.json फ़ाइल बनाकर tslint कॉन्फ़िगर करें

 { "extends": ["tslint:recommended", "tslint-config-prettier"], "rules": { "curly": false, "ordered-imports": false, "interface-name": [true, "never-prefix"] } } 

Tslint स्क्रिप्ट और कोडस्टाइल जोड़ें:

  "tslint": "tslint -p tslint -p tsconfig.json", "codestyle": "npm run prettier && npm run tslint" 

अब कमिट करने से पहले कोडेक्स रन बनाते हैं और package.json जोड़ते हैं:

 "husky": { "hooks": { "pre-commit": "npm run codestyle" } } 

प्रलेखन

Md से वेब पेज बनाने के लिए हम डॉक्सिफाई का उपयोग करते हैं और एपीआई tsdoc से प्रलेखन उत्पन्न करते हैं

उन्हें स्थापित करें

 npm i docsify-cli typedoc -D 

डॉक्स फ़ोल्डर में, README.md बनाएँ:

 # Best lib ever Best lib ever `helloWorld` return `'hello world'` ## Example ``js const a = require('') console.log(a.helloWorld()) // prints 'Hello world!' `` 

इसके अलावा अधिक जोड़ें
स्रोत यहाँ है

आगे करते हैं

 npx docsify init ./docs 

साइडबार में साइडबार को सेट करें। साइडबार फ़ाइल को बनाकर

 # Best lib ever * [Best lib ever](/) * [More examples](/moreExamples) 

अब, यह सब सुंदरता देखने के लिए, एक स्क्रिप्ट जोड़ें

 "docsify": "docsify serve ./docs" 

और दौड़ो

 npm run docsify 

अब एक स्थैतिक विधि प्रलेखन लेते हैं
सबसे पहले, कोड में फ़ंक्शन का विवरण जोड़ें:

 /** * Returns `Hello world!` */ 

। .gitinore में docs/api जोड़ें

टाइप्डोक के लिए स्क्रिप्ट जोड़ें

 "typedoc": "typedoc --out ./docs/api ./src --mode file --readme docs/README.md" 

अंत में, अंतिम डॉक स्क्रिप्ट जोड़ें

 "docs": "npm run typedoc && npm run docsify" 

डॉक देखने के लिए अब सब कुछ पर्याप्त है

 npm run docs 

परीक्षण

जेस्ट स्थापित करें

 npm install --save-dev @types/jest @types/node jest ts-jest typescript 

चलो jest.config.js कॉन्फ़िगरेशन बनाते हैं

 module.exports = { roots: ['/src'], transform: { '^.+\\.tsx?$': 'ts-jest', }, testRegex: '(/__test__/.*|(\\.|/)(test|spec))\\.tsx?$', moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'], } 

एक परीक्षण बनाएं ( test/index.ts ):

 import { helloWorld } from "../src"; test('Should return helloWorld', () => { expect(helloWorld()).toBe('Hello world!') }) 

और अब आप पर परीक्षण चला सकते हैं

 npm test 

हम सामान्यीकरण

अब हम कर सकते हैं

 npm run build #   npm run dev #    npm run codestyle #    npm run docs #   npm test #   

अंतिम गितुब भंडार