جشنواره عیدانه راکت | عضویت ویژه راکت برای آخرین بار | افزایش قیمت‌ها از سال جدید | و ...

مشاهده اطلاعات بیشتر...
ثانیه
دقیقه
ساعت
روز
استایل دهی به متن ها با Chalk در Node.js
ﺯﻣﺎﻥ ﻣﻄﺎﻟﻌﻪ: 3 دقیقه

استایل دهی به متن ها با Chalk در Node.js

پکیج colors.js یکی از محبوب ترین ها برای استایل دهی به متن ها بوده, اما اون نقص های جدی داره مثلا گسترش String.prototype که عامل مشکلات مختلف میشه. اگرچه پکیج های دیگری هم ساخته شدند, اما اون ها به اندازه کافی خوب نبودند.

Chalk بسیار تمیز است و داره تلاش می کنه جایگزین مناسبی باشه.

ویژگی های مهم

  • API واضح
  • بسیار کاربردی
  • توانایی ساخت استایل های تو در تو
  • پشتیبانی از رنگ 256/Truecolor
  • پشتیبانی از تشخیص خودکار رنگ
  • تمیز و متمرکز
  • بصورت فعال توسعه داده می شود
  • در 17000 پکیج استفاده شده

نحوه نصب

npm install chalk

نحوه استفاده

const chalk = require('chalk');

console.log(chalk.blue('Hello world!'));

Chalk به همراه یک API خوانا و ساده آمده تا شما بتونید استایل ها رو بصورت تو در تو هم استفاده کنید :

const chalk = require('chalk');

const log = console.log;

// Combine styled and normal strings 

log(chalk.blue('Hello') + 'World' + chalk.red('!'));


// Compose multiple styles using the chainable API 

log(chalk.blue.bgRed.bold('Hello world!'));

// Pass in multiple arguments 

log(chalk.blue('Hello', 'World!', 'Foo', 'bar', 'biz', 'baz'));

// Nest styles 

log(chalk.red('Hello', chalk.underline.bgBlue('world') + '!'));


// Nest styles of the same type even (color, underline, background) 

log(chalk.green(

    'I am a green line ' +

    chalk.blue.underline.bold('with a blue substring') +

    ' that becomes green again!'

));



// ES2015 template literal 

log(`

CPU: ${chalk.red('90%')}

RAM: ${chalk.green('40%')}

DISK: ${chalk.yellow('70%')}

`);



// ES2015 tagged template literal 

log(chalk`

CPU: {red ${cpu.totalPercent}%}

RAM: {green ${ram.used / ram.total * 100}%}

DISK: {rgb(255,131,0) ${disk.used / disk.total * 100}%}

`);



// Use RGB colors in terminal emulators that support it. 

log(chalk.keyword('orange')('Yay for orange colored text!'));

log(chalk.rgb(123, 45, 67).underline('Underlined reddish color'));

log(chalk.hex('#DEADED').bold('Bold gray!'));

به راحتی تم های خود رو تعریف کنید :

const chalk = require('chalk');



const error = chalk.bold.red;

const warning = chalk.keyword('orange');



console.log(error('Error!'));

console.log(warning('Warning!'));

از ویژگی پیشرفته ی console.log استفاده کنید :

const name = 'Sindre';

console.log(chalk.green('Hello %s'), name);

//=> 'Hello Sindre'

درباره API

چند نمونه از استفاده ی این API بصورت زیر هست :

chalk.<style>[.<style>...](string, [string...])



chalk.red.bold.underline('Hello', 'world');

استایل ها رو بصورت زنجیروار بیاورید و آخرینش رو بعنوان متد با یک رشته بعنوان argument استفاده کنید. ترتیب زیاد مهم نیست و استایل های بعدی درصورت ناسازگاری مقدم هستند. این یعنی chalk.red.yellow.green معادل chalk.green هست. argument های چندتایی با یک فاصله (space) از هم جدا می شوند.

chalk.enabled

اگر شما بخواهید به سادگی chalk رو فعال/غیرفعال کنید, شما میتونید از enabled. استفاده نمایید.

chalk بصورت پیشفرض فعال هست مگر اینکه در constructor غیرفعال بشه یا اینکه chalk.level برابر صفر بشه.

اگر می خواهید اون رو در یک ماژول قابل استفاده مجدد, تغییر بدید, یک نمونه (instance) جدید بسازید : 

const ctx = new chalk.constructor({enabled: false});

chalk.level

پشتیبانی رنگ (تعداد رنگ هایی که ساپورت می شوند) بصورت خودکار شناسایی میشه اما شما میتونید اون رو با قرار دادن ویژگی level بازنویسی کنید. از اون جا که به تمام consumer های Chalk اعمال میشه, شما باید اینو در کد مدنظر خودتون انجام بدید. 

اگر می خواهید اون رو در یک ماژول قابل استفاده مجدد, تغییر بدید, یک نمونه (instance) جدید بسازید :

const ctx = new chalk.constructor({level: 0});

level ها بصورت زیر هستند :

  1. تمام رنگ ها غیرفعال
  2. فقط از رنگ های پایه پشتیبانی بشه (16 رنگ)
  3. پشتیبانی از 256 رنگ
  4. پشتیبانی از trucolor که 16 میلیون رنگ هست.

chalk.supportsColor

شناسایی می کنه که ترمینال رنگ ها رو به چه صورت ساپورت می کنه. 

میتونه توسط کاربر با نشانه ی color-- و no.color-- بازنویسی بشه. ممکنه گاهی استفاده از color-- پشتیبانی نشه, در این صورت متغیر محیطی FORCE_COLOR=1 رو برای فعالسازی و FORCE_COLOR=0 رو برای غیرفعال کردن وارد کنید. استفاده از FORCE_COLOR تمام پشتیبانی رنگ ها (که توضیح داده شد) رو بازنویسی می کنه.

برای حالت 256/Truecolor میتونید از color=256-- و color=16m-- بهره ببرید.

استایل ها

حالات اصلاحی 

  • reset
  • bold
  • dim
  • italic (Not widely supported)
  • underline
  • inverse
  • hidden
  • strikethrough (Not widely supported)

رنگ ها

  • black
  • red
  • green
  • yellow
  • blue (On Windows the bright version is used since normal blue is illegible)
  • magenta
  • cyan
  • white
  • gray
  • blackBright
  • redBright
  • greenBright
  • yellowBright
  • blueBright
  • magentaBright
  • cyanBright
  • whiteBright

رنگ های بک گراند

  • bgBlack
  • bgRed
  • bgGreen
  • bgYellow
  • bgBlue
  • bgMagenta
  • bgCyan
  • bgWhite
  • bgBlackBright
  • bgRedBright
  • bgGreenBright
  • bgYellowBright
  • bgBlueBright
  • bgMagentaBright
  • bgCyanBright
  • bgWhiteBright

چند مثال دیگر

chalk.hex('#DEADED').underline('Hello, world!')

chalk.keyword('orange')('Some orange text')

chalk.rgb(15, 100, 204).inverse('Hello!')

 

چه امتیازی برای این مقاله میدهید؟

خیلی بد
بد
متوسط
خوب
عالی
در انتظار ثبت رای

دیدگاه و پرسش

برای ارسال دیدگاه لازم است وارد شده یا ثبت‌نام کنید ورود یا ثبت‌نام

در حال دریافت نظرات از سرور، لطفا منتظر بمانید

در حال دریافت نظرات از سرور، لطفا منتظر بمانید