在本文中，我们分析 create-next-app 如何验证您的项目名称。

validate: (name) => {
 const validation = validateNpmName(basename(resolve(name)))
 if (validation.valid) {
   return true
 }
 return 'Invalid project name: '   validation.problems[0]
},

您是否尝试过在使用 create-next-app 命令时使用空格命名项目？如果您这样做了，您的项目中将不允许有空格，因为它在命名您的项目时遵循某些原则。

那么这些命名约定规则是什么呢？

validateNpmName 函数

如果您检查此 create-next-app/index.ts，它会调用名为 validateNpmName 的函数。这是从 helpers/validate-pkg.ts

这个函数很简单，调用一个名为 validateProjectName 的函数，该函数是从 validate-npm-package-name 导入的。

文档说，如果名称有效，您将得到以下对象：

{
 validForNewPackages: true,
 validForOldPackages: true
}

什么使名称有效？我们再检查一下文档。文档提供了这些命名规则：

1. 包名长度应大于零

2. 包名称中的所有字符都必须是小写，即不允许使用大写或大小写混合的名称

3. 包名称可以由连字符组成

4. 包名称不得包含任何非 url 安全字符（因为名称最终是 URL 的一部分）

5. 包名称不应以 .或者 _

6. 包名不应包含任何空格

7. 包名称不应包含以下任何字符：~)(‘!*

8. 包名称不能与node.js/io.js核心模块相同，也不能与保留/黑名单名称相同。例如，以下名称无效：
   
   — http
   
   - 溪流
   
   — 节点模块
   
   — favicon.ico

9. 包名长度不能超过214

这些是命名 Next.js 项目时应牢记的规则。

关于我们：

在 Think Throo，我们的使命是教授开源项目中使用的高级代码库架构概念。

通过在 Next.js/React 中练习高级架构概念，提高您的编码技能，学习最佳实践并构建生产级项目。

我们是开源的 — https://github.com/thinkthroo/thinkthroo （请给我们一颗星！）

我们还提供网络开发和技术写作服务。请通过 [email protected] 联系我们了解更多信息！

参考：

1. https://github.com/vercel/next.js/blob/canary/packages/create-next-app/index.ts#L162

2. https://github.com/vercel/next.js/blob/canary/packages/create-next-app/helpers/validate-pkg.ts#L13

3. https://www.npmjs.com/package/validate-npm-package-name

4. https://github.com/npm/validate-npm-package-name/tree/main