TypeScript میں ایکسٹینشن انسٹال کریں۔ Visual Studio Code
TypeScript میں ایکسٹینشن انسٹال کریں۔ Visual Studio Code
کھولیں Visual Studio Code اور ایکسٹینشن پین پر جائیں۔
" " تلاش کریں TypeScript اور آفیشل TypeScript ایکسٹینشن انسٹال کریں۔
TypeScript tsconfig.json فائل میں کمپائلر آپشنز کو کنفیگر کریں۔
TypeScript tsconfig.json فائل میں کمپائلر آپشنز کو کنفیگر کریں ۔
اپنے پروجیکٹ کی ضروریات کے مطابق کمپائلر کے اختیارات کو اپنی مرضی کے مطابق بنائیں۔
مثال کے طور پر:
{
"compilerOptions": {
"target": "es6",
"module": "commonjs",
"strict": true
}
}
IntelliSense، آٹومیٹک ٹائپ چیکنگ، اور کوڈ نیویگیشن ان جیسی خصوصیات کا استعمال کریں۔ Visual Studio Code
انٹیگریٹڈ کے ساتھ TypeScript ، آپ IntelliSense کی تجاویز، قسم کی معلومات، اور غلطی کا پتہ لگانے سے استفادہ کریں گے جب آپ میں کوڈ لکھیں گے Visual Studio Code ۔
TypeScript کی جدید زبان کی خصوصیات، جیسے کوڈ نیویگیشن اور ری فیکٹرنگ، ایڈیٹر کے اندر بھی دستیاب ہیں۔
TypeScript کے ساتھ انضمام Webpack
ضروری پیکجز انسٹال کریں: typescript ts-loader اور webpack
پیکجوں کو انسٹال کرنے کے لیے درج ذیل کمانڈ کو چلائیں:
npm install typescript ts-loader webpack --save-dev
ts-loader کا استعمال کرتے ہوئے فائلوں کو ہینڈل کرنے کے لیے ترتیب دیں۔ webpack.config.js TypeScript
اپنی فائل میں درج ذیل کنفیگریشن شامل کریں: webpack.config.js
module.exports = {
entry: './src/index.ts',
module: {
rules: [
{
test: /\.ts$/,
use: 'ts-loader',
exclude: /node_module/
}
]
},
resolve: {
extensions: ['.ts', '.js']
},
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
}
};
TypeScript تالیف اور بنڈلنگ کو بہتر بنانے کے لیے اضافی پلگ ان اور لوڈرز مرتب کریں۔
آپ اپنی تعمیر کے عمل کو مزید بہتر بنانے کے لیے دیگر پلگ انز اور لوڈرز جیسے terser- webpack -plugin، clean- webpack -plugin، یا babel -loader شامل کر سکتے ہیں۔
TypeScript کے ساتھ انضمام Babel
ضروری پیکجز انسٹال کریں: typescript @ babel /preset- typescript ، اور @ babel /cli
پیکجوں کو انسٹال کرنے کے لیے درج ذیل کمانڈ کو چلائیں:
npm install typescript @babel/preset-typescript @babel/cli --save-dev
ترتیب دیں یا پیش سیٹ کو شامل کریں۔ .babelrc babel.config.js TypeScript
بنائیے ایک. babel rc فائل یا اپنی .config.js فائل میں درج ذیل کنفیگریشن شامل کریں babel:
module.exports = {
presets: ['@babel/preset-typescript']
};
Babel مخصوص TypeScript خصوصیات یا مطابقت کی ضروریات کے لیے ترتیب کو حسب ضرورت بنائیں
آپ Babel مخصوص TypeScript خصوصیات کو فعال کرنے یا ہدف کے ماحول کے ساتھ مطابقت کو یقینی بنانے کے لیے اضافی پلگ ان یا پیش سیٹ شامل کر سکتے ہیں۔
تجاویز اور بہترین عمل
- اپنے منتخب کردہ ترقیاتی ٹولز میں بہتر پیداواری صلاحیت اور ڈویلپر کے تجربے کے لیے متعلقہ TypeScript ایکسٹینشنز اور پلگ ان انسٹال کریں۔
- ترقی کے دوران تیزی سے تعمیراتی اوقات کے لیے لیوریج TypeScript کی انکریمنٹل کمپلیشن فیچر(
tsc --watchیا)۔webpack --watch - اپنے مخصوص ترقیاتی ماحول کے ساتھ انضمام کو ٹھیک کرنے کے لیے جدید ترین کنفیگریشن کے اختیارات دریافت کریں، جیسے کہ کے لیے ESLint کے قوانین ترتیب دینا TypeScript ۔
TypeScript اس جامع گائیڈ پر عمل کرتے ہوئے، آپ بغیر کسی رکاوٹ کے مقبول ڈویلپمنٹ ٹولز جیسے Visual Studio Code, Webpack, اور میں ضم کر سکیں گے Babel ۔ TypeScript یہ آپ کے ترقیاتی کام کے فلو کو بڑھا دے گا، زبان کی جدید خصوصیات فراہم کرے گا، اور آپ کو اپنے منصوبوں میں 'کے فوائد سے بھرپور فائدہ اٹھانے کی اجازت دے گا ۔