1. string-width
Get the visual width of a string - the number of columns required to display it
string-width
Package: string-width
Created by: sindresorhus
Last modified: Mon, 22 Jan 2024 10:48:05 GMT
Version: 7.1.0
License: MIT
Downloads: 560,759,192
Repository: https://github.com/sindresorhus/string-width

Install

npm install string-width
yarn add string-width

string-width

Get the visual width of a string - the number of columns required to display it

Some Unicode characters are fullwidth and use double the normal width. ANSI escape codes are stripped and doesn't affect the width.

Useful to be able to measure the actual width of command-line output.

Install

 npm install string-width

Usage

 import stringWidth from 'string-width';

stringWidth('a');
//=> 1

stringWidth('古');
//=> 2

stringWidth('\u001B[1m古\u001B[22m');
//=> 2

API

stringWidth(string, options?)

string

Type: string

The string to be counted.

options

Type: object

ambiguousIsNarrow

Type: boolean
Default: true

Count ambiguous width characters as having narrow width (count of 1) instead of wide width (count of 2).

Ambiguous characters behave like wide or narrow characters depending on the context (language tag, script identification, associated font, source of data, or explicit markup; all can provide the context). If the context cannot be established reliably, they should be treated as narrow characters by default.

  • http://www.unicode.org/reports/tr11/
countAnsiEscapeCodes

Type: boolean
Default: false

Whether ANSI escape codes should be counted.

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin