资讯专栏INFORMATION COLUMN

[npm资源] naming-style,快速转换各种命名风格

xiao7cn / 2073人阅读

摘要:一个简单的工具类库,用于将文本转化为不同格式的命名风格如驼峰式连字符式常量式等。

naming-style

https://www.npmjs.com/package...

一个简单的工具类库,用于将文本转化为不同格式的命名风格(如:驼峰式、连字符式、常量式等)。

安装
yarn add naming-style

or

npm i naming-style
使用
import {
  style,
  camel,
  pascal,
  hyphen,
  constant,
  snake,
  underscore,
  setence,
} from "naming-style";

style("iAm24YearsOld"); // 检测文本 "iAm24YearsOld" 的命名风格
// Output: "camel"

style("--naming-style -loves you"); // 检测文本 "--naming-style -loves you" 的命名风格
// Output: "other"

camel("--naming-style -loves you"); // 转换为驼峰式命名
// Output: "namingStyleLovesYou"

pascal("--naming-style -loves you"); // 转换为大写驼峰式命名
// Output: "NamingStyleLovesYou"

hyphen("--naming-style -loves you"); // 转换为连字符式命名
// Output: "naming-style-loves-you"

constant("--naming-style -loves you"); // 转换为常量式命名
// Output: "NAMING_STYLE_LOVES_YOU"

snake("--naming-style -loves you"); // 转换为“蛇”式命名
// Output: "naming_style_loves_you"

sentence("--naming-style -loves you"); // 转换为单个句子
// Output: "Naming-style loves you"

underscore("--naming-style -loves you"); // 转换为下划线形式
// Output: "__naming_style__loves_you"
特性 1. 工具方法

此类库提供了 8 个工具方法:

style() 用于检测文本的命名风格

其他 7 个方法分别用于将文本转换为对应的命名风格

2. 支持转换的命名风格

此类库支持 7 种命名风格的转换,分别为:camel, pascal, hyphen, constant, snake, sentenceunderscore

其中,前 6 种风格作为 基础风格,下划线风格(underscore)由基础风格派生而成

举例:

camel       -->  "iAm24YearsOld"
pascal      -->  "IAm24YearsOld"
hyphen      -->  "i-am-24-years-old"
constant    -->  "I_AM_24_YEARS_OLD"
snake       -->  "i_am_24_years_old"
sentence    -->  "I am 24 years old"
underscore  -->  "i_am_24_years_old"
3. 基础风格对应的方法是相互可逆的

如果要转换的文本属于前面说的 6 种 基础风格 之一,则使用其对应的转换方法可以完成互逆的转换

举例:

import { style, camel, snake } from "naming-style";

const origin = "i_am_24_years_old";

const namingStyle = style(origin);
console.log(namingStyle);
// "snake"

const camelCase = camel(origin);
const snake_case = snake(camelCase);
const newCamelCase = camel(snake_case);

console.log(camelCase === newCamelCase);
// true
4. 转换无匹配风格的文本

如果要转换的文本不属于类库提供的 7 种风格,则 style 方法的返回为 "other"

举例:

import { style } from "naming-style";

style("--naming-style -loves you");
// Output: "other"

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/96132.html

相关文章

  • 前端模块化和构建工具

    摘要:以前一直对前端构建工具的理解不深,经过几天的研究特意来总结一下,第一次写博客,有写错的请多多见谅,该文章我也从其他博客拷了一些内容,如果有冒犯之处,请指出。强大的设计使得它更像是一个构建平台,而不只是一个打包工具。 以前一直对前端构建工具的理解不深,经过几天的研究特意来总结一下,第一次写博客,有写错的请多多见谅,该文章我也从其他博客拷了一些内容,如果有冒犯之处,请指出。 如今,网页不再...

    ad6623 评论0 收藏0
  • vscode常用插件【全了】

    摘要:插件集待补充。。。同时,它还包含了用于转换为格式和生成数据模式的选项用于压缩合并和文件的应用程序。它提供了大量自定义的设置,以及自动压缩保存并导出为文件的选项。修改文本的更多命名格式,包括驼峰命名下划线分隔命名,命名以及命名等切换漂亮的主题 插件集 待补充。。。 20180903 文件 【Path Intellisense】 自动补全路径 浏览器 【Open-In-Browser】在...

    kyanag 评论0 收藏0
  • vscode常用插件【全了】

    摘要:插件集待补充。。。同时,它还包含了用于转换为格式和生成数据模式的选项用于压缩合并和文件的应用程序。它提供了大量自定义的设置,以及自动压缩保存并导出为文件的选项。修改文本的更多命名格式,包括驼峰命名下划线分隔命名,命名以及命名等切换漂亮的主题 插件集 待补充。。。 20180903 文件 【Path Intellisense】 自动补全路径 浏览器 【Open-In-Browser】在...

    xcc3641 评论0 收藏0
  • 基于 Gulp + Browserify 构建 ES6 环境下的自动化前端项目

    摘要:本文特此给大家介绍下如何使用配合来构建基于的前端项目。最后,在目录下会生成最终的项目文件。执行单元测试本例中使用进行单元测试。 随着React、Angular2、Redux等前沿的前端框架越来越流行,使用webpack、gulp等工具构建前端自动化项目也随之变得越来越重要。鉴于目前业界普遍更流行使用webpack来构建es6(ECMAScript 2015)前端项目,网上的相关教程也比...

    yuanxin 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<