В этой статье мы анализируем, как 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-имя-пакета.

В документации сказано, что если имя действительно, вы получите обратно указанный ниже объект:

{
 validForNewPackages: true,
 validForOldPackages: true
}

Что делает имя действительным? давайте еще раз проверим документацию. Документация предоставляет следующие правила именования:

1. длина имени пакета должна быть больше нуля

2. все символы в имени пакета должны быть строчными, т. е. имена в верхнем регистре или в смешанном регистре не допускаются.

3. имя пакета может состоять из дефисов

4. имя пакета не должно содержать символы, небезопасные для URL-адресов (поскольку имя становится частью URL-адреса)

5. имя пакета не должно начинаться с . или _

6. имя пакета не должно содержать пробелов

7. имя пакета не должно содержать ни одного из следующих символов: ~)('!*

8. имя пакета не может совпадать с именем основного модуля node.js/io.js или зарезервированным/занесенным в черный список именем. Например, следующие имена недопустимы:
   
   — http
   
   - транслировать
   
   — node_modules
   
   — favicon.ico

9. длина имени пакета не может превышать 214

Это правила, которые следует учитывать при названии проекта Next.js.

О нас:

В Think Throo мы стремимся обучать передовым архитектурным концепциям кодовой базы, используемым в проектах с открытым исходным кодом.

Увеличьте свои навыки программирования в 10 раз, практикуя передовые архитектурные концепции в 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-имя-пакета

4. https://github.com/npm/validate-npm-имя-пакета/tree/main