validate-npm-package-name 源码阅读

在掘金摸鱼的瓜皮
1,020 阅读4分钟

1 学习目标

了解 validate-npm-package-name 作用和使用场景
了解 CommonJs 模块 和 Es Module 模块的区别

2 库介绍

接收一个字符串，检查是否是一个有效的npm包名。
函数参数为字符串，返回一个具有两个属性的对象

{
  validForNewPackages: Boolean,
  validForOldPackages: Boolean
}

3 npm 包名规则

  1. 名称长度应大于零
  2. 名称中的所有字符都必须是小写的，不允许使用大写或混合大写的名称
  3. 名称可以由连字符组成
  4. 名称不能包含任何非url安全字符
  5. 名称不应以 . 或者 _ 开头
  6. 名称不应包含任何空格
  7. 名称不应包含以下任何字符（ ~)('!* ）
  8. 名称不能与node.js/io.js 的核心模块 或者 保留名、黑名单相同。（ node_modules、favicon.ico.... ）
  9. 名称长度不能超过214

4 示例

4.1 有效的包名

var validate = require("validate-npm-package-name")
validate("some-package")
validate("example.com")
validate("under_score")
validate("123numeric")
validate("@npm/thingy")
validate("@jane/foo.js")

4.2 无效的包名

// 携带 ！
validate("excited!")
//携带空格
validate(" leading-space:and:weirdchars")

5 源码内容

5.1 代码整体结构

var scopedPackagePattern = new RegExp('^(?:@([^/]+?)[/])?([^/]+?)$')
// node.js内置模块列表
var builtins = require('builtins')
var blacklist = [
  'node_modules',
  'favicon.ico',
]
// 判断包名是否规范
function validate (name) {
}
// 返回结果
var done = function (warnings, errors) {
}
module.exports = validate

整体结构比较简单，可以看到第一行是一个正则，通过可视化稍微解释一下这个正则作用，复习一下正则语法
这里划分为
' ： 匹配第一个字符为'
^(?:@([^/]+?)[/])? : 匹配 @xxx/ 中的xxx, 涉及到(?:xx)非捕获括号、+?也就是 {1,}? 惰性模式、?也就是 {0,1}
([^/]+?)$ : 匹配非/ 惰性匹配1次或多次
结果是匹配 '@user/package' 中的 user 和 package
image.png

5.2 done 函数

/* 
  接收警告和错误集合，返回结果
*/
var done = function (warnings, errors) {
  var result = {
    validForNewPackages: errors.length === 0 && warnings.length === 0,
    validForOldPackages: errors.length === 0,
    warnings: warnings,
    errors: errors,
  }
  if (!result.warnings.length) {
    delete result.warnings
  }
  if (!result.errors.length) {
    delete result.errors
  }
  return result
}

5.3 validate 函数

/*
  判断 npm 包名函数
*/
function validate (name) {
  var warnings = []
  var errors = []
  <!-- 名称需要为字符串 -->
  // 包名不能是 null
  if (name === null) {
    errors.push('name cannot be null')
    return done(warnings, errors)
  }
  // 包名不能是 undefined
  if (name === undefined) {
    errors.push('name cannot be undefined')
    return done(warnings, errors)
  }
  // 包名不能是非字符串
  if (typeof name !== 'string') {
    errors.push('name must be a string')
    return done(warnings, errors)
  }
  <!-- 1. 名称长度应大于零 -->
  if (!name.length) {
    errors.push('name length must be greater than zero')
  }
  <!-- 5.名称不应以 . 或者 _  开头 -->
  if (name.match(/^\./)) {
    errors.push('name cannot start with a period')
  }

  if (name.match(/^_/)) {
    errors.push('name cannot start with an underscore')
  }
  <!-- 6. 名称不应包含任何空格 -->
  if (name.trim() !== name) {
    errors.push('name cannot contain leading or trailing spaces')
  }

  <!-- 8.名称不能与node.js/io.js 的核心模块 或者 保留名、黑名单相同。（ node_modules、favicon.ico.... ）-->
  // 名称不能为 ['node_modules', 'favicon.ico']
  blacklist.forEach(function (blacklistedName) {
    if (name.toLowerCase() === blacklistedName) {
      errors.push(blacklistedName + ' is a blacklisted name')
    }
  })
  <!-- 名称不能为 like http, events, util, etc，更多看 builtins 库 -->
  builtins({ version: '*' }).forEach(function (builtin) {
    if (name.toLowerCase() === builtin) {
      warnings.push(builtin + ' is a core module name')
    }
  })
  <!-- 9. 名称长度不能超过214 -->
  if (name.length > 214) {
    warnings.push('name can no longer contain more than 214 characters')
  }
  <!-- 2. 名称中的所有字符都必须是小写的，不允许使用大写或混合大写的名称 -->
  if (name.toLowerCase() !== name) {
    warnings.push('name can no longer contain capital letters')
  }
  <!-- 7. 名称不应包含以下任何字符 ~)('!* -->
  // 包名为 'node!/fash', 只截取判断 / 后面的名称是否符合规范
  if (/[~'!()*]/.test(name.split('/').slice(-1)[0])) {
    warnings.push('name can no longer contain special characters ("~\'!()*")')
  }
  <!-- 4. 名称不能包含任何非url安全字符 -->
  if (encodeURIComponent(name) !== name) {
    // Maybe it's a scoped package name, like @user/package
    var nameMatch = name.match(scopedPackagePattern)
    if (nameMatch) {
      var user = nameMatch[1]
      var pkg = nameMatch[2]
      if (encodeURIComponent(user) === user && encodeURIComponent(pkg) === pkg) 			{
        return done(warnings, errors)
      }
    }
    errors.push('name can only contain URL-friendly characters')
  }

  return done(warnings, errors)
}

5.4 测试文件

在 test 文件夹下看到一个用于测试的用例

/*
  require('..') 会自动去 package.json 文件下查找 "main" 或者 "modules"
  在 package.json 看到 main: 'lib/'
  也就是等于 require('../lib/index.js')
*/
var validate = require('..')
var test = require('tap').test
test('validate-npm-package-name', function (t) {
  // Traditional
  t.same(validate('some-package'), { validForNewPackages: true, validForOldPackages: true })
  // Scoped (npm 2+)
  t.same(validate('@npm/thingy'), { validForNewPackages: true, validForOldPackages: true })
  t.same(validate('@npm-zors/money!time.js'), {
    validForNewPackages: false,
    validForOldPackages: true,
    warnings: ['name can no longer contain special characters ("~\'!()*")'],
  })
  // Invalid
  t.same(validate(''), {
    validForNewPackages: false,
    validForOldPackages: false,
    errors: ['name length must be greater than zero'] })
  t.end()
})

5.4.1 main 和 modules 两种方式?

在此基础上，先解析为什么会有 CommonJs 和 ES Module ？

  • 因为 js 早期都是通过 script 标签引入 js 文件代码，容易造成变量污染、文件不好维护等问题，为了解决上 面的问题，出现了 CommonJs 是一种模块化的规范，在 es6 版本正式加入了 ES Module 模块
  • 解决了变量名污染，每个文件都是独立的，不存在污染问题
  • 解决文件依赖问题，一个文件里可以清楚的看到依赖了那些其它文件
    为了区分文件使用的是 CommonJs 模块还是 ES Module 模块
  • main： 对应 CommonJs，定义了 npm 包的入口文件，browser 环境和 node 环境均可使用
  • modules： 对应 ES Module，定义 npm 包的 ESM 规范的入口文件，browser 环境和 node 环境均可使用
    CommonJs 和 ES Module 之间的使用和区别是什么？
  • CommonJs:

// index.js
module.exports.name = "张三"
module.exports.age = 24
// 使用
let data = require("./index.js")
console.log(data) // { name: "张三", age: 24 }

  • ES Module:

// index.js
export const name = "张三"
export const age = 24
// 单个导入
import { name, age } from './index.js'
console.log(name, age) // "张三" 24
// 全部导入
import * as all from './index.js'
console.log(all) // {name: "张三", age: 24}
总结:
CommonJs

  • CommonJs 可以动态加载语句，代码发生在运行时
  • CommonJs 混合导出单个值时，就不能再混合导出对象，导出对象会覆盖单个值
  • CommonJs 导出值是拷贝，可以修改导出的值，这在代码出错时，不好排查引起变量污染
    Es Module
  • Es Module 是静态的，不可以动态加载语句，只能声明在该文件的最顶部，代码发生在编译时
  • Es Module 混合导出，单个导出，默认导出，完全互不影响
  • Es Module 导出是引用值之前都存在映射关系，并且值都是可读的，不能修改

5.4.2 tap库介绍（ tap 地址 ）

用于Node.js 中编写测试的测试框架
用于运行测试并报告测试成功或失败的命令行界面

<!-- 简单的使用 -->
// demo.js
module.exports = x => {
  if (x % 2 === 0) {
    return 'even'
  } else if (x % 2 === 1) {
    return 'odd'
  } else if (x > 100) {
    return 'big'
  } else if (x < 0) {
    return 'negative'
  }
}

// test.js
const tap = require('tap')
const mam = require('../demo.js')
tap.equal(mam(1), 'odd')
tap.equal(mam(2), 'even')

npm run snap 可以看出控制台输出一份测试报告，可以看到包含文件、覆盖率等信息

image.png

6 总结

一句话简述 validate-npm-package-name 原理：通过包名规则，判断包名是否符合规范，从而返回结果。
通过本文，了解到 Node 加载采用的模块，CommonJs 和 ES Modules 的区别，复习了一遍正则语法的使用。

avatar
文章
阅读
粉丝