NPM подсказки и советы для начинающих

image

Если вы ежедневно используете NPM в своей работе, то скорее всего вы по достоинству оцените эти подсказки и советы.

Создание файла package.json

В этом случае мы обычно используем команду npm init и затем добавляем информацию, которую запрашивает npm. Но, если в некоторых случаях нет никакой необходимости заботиться о том, какая информация будет в файле package.json и возможно использовать дефолтные значения для проекта, то мы просто нажимаем enter вместо того, чтобы отвечать на вопросы npm. Чтобы не терять время на это можно просто добавить -y или --yes к команде npm init. В этом случае package.json будет создан с дефолтными настройками без дополнительных вопросов.

Установка модулей

Вместо npm install можно использовать упрощенный вариант npm i.

Установка нескольких модулей за один раз

Вместо использования команды npm install для каждого модуля, как например:

npm i gulp-pug  
npm i gulp-debug  
npm i gulp-sass

Можно одной командой инсталировать все модули сразу:

npm i gulp-pug gulp-debug gulp-sass

Еще проще сожно установить нескольуо модулей за один раз, если их названия начинаются с одного и того же сочетания букв:

npm i gulp{-debug,-sass,-pug}

Использования установочных флагов

Если вы хотите установить пакет и сохранить его в production зависимостях, то обычно это делается следующим образом:

npm i gulp --save-prod

Но, также можно использовать флаг -P:

npm i gulp -P

То же самое справедливо для development зависимостей, вместо --save-dev можно использовать флаг -D:

npm i gulp -D

По умолчанию, когда вы запускаете команду npm install без флагов, npm добавит устанавливаемый пакет в зависимости вашего файла package.json. Если вы хотите предотвратить это, то используйте флаг --no-save при установке такого пакета:

npm i vue --no-save

Информация о пакетах

Следующие команды покажут вам информацию относящуюся к пакету vue:

npm view vue или npm v vue

2 Результат выполнения комманды npm view

В случае, если вы хотите получить только последнюю версию пакета можно использовать команду:

> npm v vue version  
> 2.5.17

Если вы захотите получить полный список версий пакета, используйте ту же команду, только во множественном числе:

> npm v vue versions  
> [ '0.0.0',  
  '0.6.0',  
  '0.7.0',  
  ...  
  '2.5.15',  
  '2.5.16',  
  '2.5.17-beta.0',  
  '2.5.17' ]

Установка определенной версии пакета

Если необходимо установить определенную версию пакета, которая не является последней, вы можете использовать команду:

npm i vue@2.5.15

Иногда легче запомнить имя, чем номер, поэтому вы можете использовать dist-теги, перечисленные после выполнения команды npm v, как показано на выше, вот так:

npm i vue@beta

Searching for a package

Иногда вы не можете просто запомнить пакета, который вы использовали в проектах некоторое время назад. В этом случае можно выполнить поиск прямо из терминала, например так:

npm search gulp debug

or

npm s gulp debug

После выполнения этих команд в терминале будет напечатан список пакетовс оприсанием, указанием авторов и другой информацией.

3 Результат поиска

Удаление пакетов

Если вы не хотите открывать файл package.json и удалять зависисомтси вручную, можно сделать это с помощью команды:

npm uninstall vue

Эта команда удалит пакет из папки node_modules и из файла package.json. Конечно в данном случае можно использовать команды rm , un или r, чтобы достичь такого же результата:

npm rm vue

Если по каким-то причинам вы хотите удалить файлы пакет из папки node_modules, но при этом сохранитьего в чписке зависимостей в файле package.json можете использовать для этого флаг no-save:

npm rm vue --no-save

Listing dependencies

Для того, чтобы посмотреть список всех зависимостей в вашем проекте, используйте комманду:

npm ls

Эта команда выведет в терминале список всех зависимостей из файла package.json, а также всех их зависимостей. если вы хотите получить список только ваших зависисомтей, то воспользуйтесь командой:

npm ls --depth=0

После выполнения этой команды вы получите что-то подобное:

├── jquery@3.3.1  
├── vue@2.5.17  
└── yarn@1.12.3

Конечно, вы можете исполььзовать флаг g, если вы хотите получить список всех ваших глобально установленных пакетов:

npm ls -g -depth 0

Запуск тестов

Тесты можно запускать с помощью комманды npm run tests, но можно проще - npm test или еще проще - npm t.

Показать доступные скрипты

Иногда мы хотим посмотреть какие скрипты включены в файл package.json. Можно открыть файл package.json, конечно, но можно также запустить команду:

npm run

Если конфигурация в в файле package.json например выглядит так:

"scripts": {  
  "test": "jest",  
  "build": "gulp build"  
}

То после выполнения команды npm run мы получим:

Lifecycle scripts included in npm:  
  test  
    jest


available via `npm run-script`:  
  build  
    gulp-build

Установка пакетов из репозитария GitHub

Вы можете также устанавливать пакеты прямо из репозитария GitHub:

npm i <https://github.com/sindresorhus/gulp-debug>

Или можно опустить доменную часть

npm i sindresorhus/gulp-debug

Открытие Github страницы пакета

Можно конечно поискать страницу пакета в Google, а можно запустить следующую команду в терминале:

npm repo create-react-app

Пакет не должен быть установлен во время выполнения этой команды.

Список всех доступных переменных среды NPM

Вы можете увидеть полный список всех переменных NPM, которые доступны:

npm run env | grep npm_

После выполнения этой команды в терминале отобразится нечто подобное:

npm_config_fetch_retry_maxtimeout=60000  
npm_config_tag_version_prefix=v  
npm_config_strict_ssl=true  
npm_config_sso_type=oauth  
.  
.  
.

Это очень полезная вещь, так как зная обо всех переменных которые вам доступны вы можете не только их использовать, но и создавать свои собственные.

Добавление собственных NPM перерменных

Вы можете добавлять свои собственные NPM переменные, добавляя новые ключи в файл package.json. Это богут быть любые ключи, но возможно также хранить все ваши NPM переменные внутри ключа config, просто в целях лучшей организации. Например так:

"config": {


  "build_folder":"./dist"


}

Если после добавления вашей собственной переменоой выполнить команду npm run env | grep npm_, вы увидите среди других переменных свою собственную:

npm_package_config_build_folder=./dist  
npm_config_fetch_retry_maxtimeout=60000  
npm_config_tag_version_prefix=v  
npm_config_strict_ssl=true  
npm_config_sso_type=oauth  
.  
.  
.

По умолчанию npm будет присваивать переменным префиксы npm_package сохраняя таким образом структуру внутри файла package.json.

использование NPM переменной в NPM скрипте

Предположим, что вы увидели полный список переменных и захотели использовать значения любых из них в вашем скрипте. Вы можете сделать это в вашем файле package.json:

"scripts": {


  "build": "gulp build --dist $npm_package_config_build_folder"


}

После запуска команды npm run build она будет выполнена как:

gulp build --dist ./dist

Вот и все!

Источник