Давайте посмотрим, как можно создать новый блестящий проект JavaScript с помощью менеджера пакетов Yarn. Мы собираемся настроить nodenv, установить Node.js и Yarn, а затем инициализировать новый проект, который затем сможем использовать в качестве основы для наших дальнейших идей.

Настройка ноденв

Во-первых, нам понадобится Node.js. Я использую Nodenv для управления несколькими установками Node.js на моем компьютере. Самый простой способ установить его на Mac — использовать Homebrew (проверьте Документацию по установке, если вы используете другую платформу):

brew install nodenv

После этого добавьте следующую строку в конец вашего файла .zshrc или .bashrc (у меня он находится в домашнем каталоге, также известном как ~):

# ~/.zshrc

# ...

eval "$(nodenv init -)"

С этого момента каждый раз, когда вы запускаете node, Nodenv будет автоматически выбирать версию Node.js, указанную в файле .node-version.

Настройка узла

Теперь давайте создадим каталог нашего проекта и добавим последнюю версию Node.js с долгосрочной поддержкой (на момент написания это 18.16.0, проверьте веб-сайт Node.js, если вы не уверены) в файл .node-version:

# Create the project directory
mkdir project

# Change into it
cd project

# Tell nodenv to use Node 18.16.0 in your project's directory
echo "18.16.0" > .node-version

Чтобы проверить установку, запустите

node --version

Если на вашем компьютере нет такой установки Node (как было в моем случае), вы увидите примерно такой результат:

nodenv: version `18.16.0' is not installed (set by /Users/anton/project/.node-version)

Чтобы это исправить, используйте nodenv для установки версии Node, указанной в файле .node-version:

nodenv install $(cat .node-version)

Nodenv загрузит и установит Node:

Downloading node-v18.16.0-darwin-x64.tar.gz...
-> https://nodejs.org/dist/v18.16.0/node-v18.16.0-darwin-x64.tar.gz
Installing node-v18.16.0-darwin-x64...
Installed node-v18.16.0-darwin-x64 to /Users/anton/.nodenv/versions/18.16.0

Теперь наш небольшой дым-тест должен вернуть правильную версию:

node --version
# => v18.16.0

Настройка пряжи

Yarn — менеджер пакетов — инструмент, позволяющий использовать код других разработчиков. Как упоминается в документации по установке Yarn, предпочтительным способом установки Yarn является использование Corepack — встроенного инструмента для управления версиями ваших менеджеров пакетов. Давайте включим Corepack и установим стабильную версию Yarn:

# Enable Corepack
corepack enable

# Install Yarn
corepack prepare yarn@stable --activate

Запустите дым-тест, чтобы убедиться, что установка прошла успешно. Следующая команда должна вернуть версию, у меня это была 3.6.0:

yarn --version
# => 3.6.0

Настройка проекта

Теперь, когда у нас есть менеджер пакетов, давайте воспользуемся им для инициализации проекта:

yarn init

Приведенная выше команда создаст несколько файлов конфигурации и инициализирует репозиторий git в папке нашего проекта. Вот для чего нужны некоторые из них:

  • .editorconfig помогает поддерживать согласованные стили кодирования для нескольких разработчиков, работающих над одним проектом в различных редакторах и IDE. Если вам интересно, дополнительную информацию можно найти на веб-сайте EditorConfig.
  • .gitattributes помогает git лучше управлять файлами вашего проекта. Дополнительную информацию смотрите на сайте git.
  • .gitignore указывает, какие файлы не должны отслеживаться git. Подробную информацию смотрите здесь.
  • .yarnrc.yml содержит конфигурацию пряжи. Подробности смотрите в Документации по файлам Yarnrc.
  • package.json содержит информацию о пакете, такую ​​как имя, packageManager и так далее.
  • README.md файл Markdown, в котором можно написать некоторую документацию.
  • yarn.lock помогает Yarn обеспечить согласованную установку зависимостей (пакетов) на разных машинах. Подробности смотрите в документации Yarn.lock.

Мы не собираемся использовать Plug’n’Play или Zero-Installs, поскольку они имеют свои плюсы и минусы и считаются расширенными функциями, поэтому давайте отключим их. Для этого мы изменим файл .gitignore так, чтобы строка !.yarn/cache была закомментирована вместо pnp.*. Мы также добавим строку node_modules:

# .gitignore

.yarn/*
!.yarn/patches
!.yarn/plugins
!.yarn/releases
!.yarn/sdks
!.yarn/versions

# Swap the comments on the following lines if you don't wish to use zero-installs
# Documentation here: https://yarnpkg.com/features/zero-installs
# !.yarn/cache
.pnp.*

node_modules

Далее мы обновим файл .yarnrc.yml. Установите для свойства nodeLinker значение node-modules, чтобы наши пакеты устанавливались по старинке:

# .yarnrc.yml

yarnPath: .yarn/releases/yarn-3.6.0.cjs
nodeLinker: node-modules

Завершите настройку, запустив yarn install или просто yarn. Это создаст каталог node_modules.

Тест на дым

Давайте удостоверимся, что мы можем устанавливать пакеты и запускать код. Мы установим lodash, вызовем из него функцию и распечатаем результат.

Установите Лодаш:

yarn add lodash

Создайте файл index.js со следующим содержимым:

// index.js

const now = require("lodash/now");

console.log(now());

Запустите index.js, он напечатает текущую временную метку:

yarn node index.js
# => 1686935711710

Вот и все! Теперь вы можете использовать эту настройку как прочную основу для своего будущего приложения.

Обратная связь

Вы можете найти исходный код в этот репозиторий GitHub. Если у вас есть какие-либо отзывы, пожалуйста, не стесняйтесь отправить проблему.

Моя оригинальная запись в блоге