Node.js делает возможным написание серверных приложений на JavaScript. Он построен на движке JavaScript V8 и написан на C++ - и поэтому он быстрый. Изначально он создавался как серверное окружение для приложений, но разработчики начали использовать его для создания инструментов, помогающих автоматизировать выполнение локальных задач. В итоге возникшая вокруг Node.js новая экосистема инструментов (типа Grunt и Gulp), привела к трансформации процесса фронтенд-разработки.
Чтобы использовать все эти инструменты (или пакеты) в Node.js нам нужна возможность устанавливать и управлять ими. Для этого создан npm, пакетный менеджер Node.js. Он устанавливает нужные вам пакеты и предоставляет удобный интерфейс для работы с ними. Но перед тем как начать использовать npm, вам надо установить в своей системе Node.js.
В этой статье мы будем использовать стабильную версию 5.7.0.
Посмотреть, где установлен Node и проверить версию можно следующими командами:
$ which node /usr/local/bin/node $ node --version v5.7.0
Чтобы удостовериться, что установка прошла успешно, выполним несколько команд в простой интерактивной среде Node (REPL).
$ node > console.log("Node is running"); Node is running > .help .break Sometimes you get stuck, this gets you out .clear Alias for .break .exit Exit the repl .help Show repl options .load Load JS from a file into the REPL session .save Save all evaluated commands in this REPL session to a file > .exit
Установка работает, поэтому теперь мы можем сфокусироваться на npm, который включен в установку.
$ which npm /usr/local/bin/npm $ npm --version 3.6.0
С помощью npm можно устанавливать пакеты локально или глобально. В локальном режиме пакеты устанавливаются в каталог node_modules родительского каталога. Владельцем каталога является текущий пользователь. Глобальные пакеты устанавливаются в каталог {prefix}/lib/node_modules/ , владельцем которого является root (префиксом в данном случае обычно является каталог /usr/ или /usr/local). Это значит, что вам надо использовать sudo для глобальной установки пакетов, что может повлечь ошибки с полномочиями при разрешении сторонних зависимостей, а также создает проблему для безопасности. Изменим это:
Посмотрим, что скажет нам команда npm config .
$ npm config list ; cli configs user-agent = "npm/3.6.0 node/v5.7.0 linux x64" ; node bin location = /usr/local/bin/node ; cwd = /home/sitepoint ; HOME = /home/sitepoint ; "npm config ls -l" to show all defaults.
Мы получили основную информацию об установке. Теперь важно узнать место установки глобальных пакетов:
$ npm config get prefix /usr/local
Этот префикс мы хотим изменить так, чтобы устанавливать пакеты в свой домашний каталог. Для этого создайте в домашнем каталоге папку.node_modules_global и укажите ее в качестве места установки пакетов в конфигурации:
$ cd && mkdir .node_modules_global $ npm config set prefix=$HOME/.node_modules_global
Внеся такую небольшую правку в конфигурацию, мы изменили место для глобальной установки пакетов. Также в нашем домашнем каталоге появился файл.npmrc .
$ npm config get prefix /home/sitepoint/.node_modules_global $ cat .npmrc prefix=/home/sitepoint/.node_modules_global
Сам npm по-прежнему установлен в каталог, владельцем которого является root. Но так как мы поменяли место установки глобальных пакетов, мы можем использовать полученное преимущество. Мы установим npm еще раз, но теперь в место, указанное нами. Заодно мы получим последнюю версию npm.
$ npm install npm --global /home/sitepoint/.node_modules_global/bin/npm -> /home/sitepoint/.node_modules_global/lib/node_modules/npm/bin/npm-cli.js /home/sitepoint/.node_modules_global/lib └── [email protected]
Наконец, нам надо добавить.node_modules_global/bin в нашу переменную окружения $PATH , чтобы мы могли запускать глобальные пакеты из командной строки. Сделаем это, добавив следующую строку в файл.profile или.bash_profile и перезапустив терминал.
Export PATH="$HOME/.node_modules_global/bin:$PATH"
Теперь командная оболочка будет сразу находить пакеты, установленные в.node_modules_global/bin и использовать корректную версию npm .
$ which npm /home/sitepoint/.node_modules_global/bin/npm $ npm --version 3.7.5
На данный момент у нас уже есть один глобальный пакет - это сам пакет npm. Изменим это и установим еще один пакет, это будет UglifyJS (инструмент для минификации JavaScript). Для глобальной установки используется флаг --global , его можно записывать сокращенно -g .
$ npm install uglify-js --global /home/sitepoint/.node_modules_global/lib └─┬ [email protected] ├── [email protected] ├── [email protected] ├── [email protected] └─┬ [email protected] ├── [email protected] ├─┬ [email protected] │ ├─┬ [email protected] │ │ ├─┬ [email protected] │ │ │ ├─┬ [email protected] │ │ │ │ └── [email protected] │ │ │ ├── [email protected] │ │ │ └── [email protected] │ │ └── [email protected] │ ├── [email protected] │ └── [email protected] ├─┬ [email protected] │ └── [email protected] └── [email protected]
Как вы можете видеть из вывода в консоль, у нас установлены дополнительные пакеты - это зависимости UglifyJS.
Мы можем вывести список глобально установленных пакетов с помощью команды npm list с опцией --global:
$ npm list --global ├─┬ [email protected] │ ├── [email protected] │ ├── [email protected] │ ├── [email protected] │ ├── [email protected] .................... └─┬ [email protected] ├── [email protected] ├── [email protected] ├── [email protected]
Такой вывод списка, со всеми зависимостями, перенасыщен. Мы можем выводить его в более читаемом виде с помощью опции --depth=0:
$ npm list -g --depth=0 ├── [email protected] └── [email protected]
Стало лучше - теперь мы видим только список установленных пакетов с номерами их версий, без зависимостей.
Теперь мы можем обрабатывать файлы JavaScript в терминале с помощью UglifyJS. Например, следующая команда сделает из файла example.js минифицированный example.min.js:
$ uglifyjs example.js -o example.min.js
Локальная установка используется в npm по умолчанию, то есть достаточно не использовать флаг --global . Пакет будет установлен в каталог node_modules родительского каталога. Создадим каталог с проектом в нашем домашнем каталоге:
$ mkdir ~/project && cd ~/project $ npm install underscore /home/sitepoint/project └── [email protected] $ ls node_modules $ ls node_modules underscore
Также как и в случае с глобальными пакетами, список локальных выводится командой npm list:
$ npm list /home/sitepoint/project └── [email protected]
Как видите, мы можем устанавливать локальные пакеты, где угодно. Это также значит, что мы можем создать другой каталог и установить туда другую версию пакета (в нашем случае это библиотека underscore).
Так как npm это пакетный менеджер, у него есть возможность удалять пакеты. Предположим, что установленная в предыдущем примере версия underscore вызывает проблемы с совместимостью. Мы можем удалить этот пакет и поставить более старую версию.
$ npm uninstall underscore - [email protected] node_modules/underscore $ npm list /home/sitepoint/project └── (empty)
Теперь установим нужную версию underscore. В команде установки номер версии указывается после символа @ :
$ npm install [email protected] /home/sitepoint/project └── [email protected] $ npm list /home/sitepoint/project └── [email protected]
В последней версии underscore исправили мешавший нам баг и мы хотим обновить версию этого пакета.
$ npm update underscore [email protected] node_modules/underscore $ npm list /home/sitepoint/project └── [email protected]
Примечание: для этой статьи, библиотека underscore была указана как зависимость в package.json (см. ).
Мы уже пару раз использовали команду mkdir . Есть ли пакет node с подобным функционалом?
$ npm search mkdir npm WARN Building the local index for the first time, please be patient
В этой статье освещены основы работы с npm. Я показал, как установить Node.js, как изменить место установки глобальных пакетов (так мы можем избежать использования sudo) и как установить пакеты локально и глобально. Я также рассмотрел удаление, обновление и установку определенной версии пакета, а также управление зависимостями проекта.
В каталоге npm тысячи пакетов и их число будет расти, с учетом анонса jQuery о публикации всех плагинов как пакетов npm.
Современная разработка очень тесно связана с использованием Node JS. В свою очередь Node JS используется как оболочка для работы с NPM и его пакетами (всем известная папка node_modules).
В данной статье я постараюсь перечислить все самые популярные команды для NPM: установка, обновление, удаление пакетов и др.
И всё таки думаю что стоит для начала упомянуть пару важных консольных команд для Node JS.
Чтобы посмотреть список всех команд доступных в Node.js, для этого нужно ввести в консоли команду:
Для этого есть команда node --version или короткий вариант команды этой же команды node -v . Так как краткость - сестра таланта, я пользуюсь командой:
Если расписывать команды NPM-а, то так же начнём с того как в консоли вывести все доступные команды нпма.
Cписок всех доступных команд пакетного менеджера (npm) выведится если в консоли ввести команду npm help или сокращённый вариант npm -h:
Команда npm -h вывалит в консоли такой список доступных команд:
access, adduser, audit, bin, bugs, c, cache, ci, cit, completion, config, create, ddp, dedupe, deprecate, dist-tag, docs, doctor, edit, explore, get, help, help-search, hook, i, init, install, install-test, it, link, list, ln, login, logout, ls, outdated, owner, pack, ping, prefix, profile, prune, publish, rb, rebuild, repo, restart, root, run, run-script, s, se, search, set, shrinkwrap, star, stars, start, stop, t, team, test, token, tst, un, uninstall, unpublish, unstar, up, update, v, version, view, whoami
Чтобы посмотреть инструкции для какой то из этих команд, для этого нужно ввести в консоли команду npm help COMANDA , где COMANDA - это название команды из списка.
Например посмотреть инструкции для обновления:
Npm help update
В установленном по умолчанию браузере откроется страница с инструкциями по данной команде. Инструкции находятся локально и не требуют подключения к интернету.
Как узнать версию NPM
Чтобы узнать установленную версию npm, нужно ввести в терминале команду npm --version или сокращённый вариан данной команды npm -v:
В отличии от Node.js, NPM знает как обновить себя! Чтобы обновить свой NPM до последней версии, вводим в терминале такую команду:
Npm install npm@latest -g
Npm update npm -g
Инициализация пакетов - это процесс быстрой установки пакетов NPM-а, которые прописаны в файле package.json
Команда npm init создаст файл package.json или установит прописанные пакеты из файла package.json если он уже создан.
Npm init
Установить пакеты из файла package.json:
Npm install
npm скачает и установит все пакеты указанные в файле package.json
Посмотреть список установленных пакетов:
Npm list --depth=0
Посмотреть список установленных пакетов, которые требуют обновления:
Npm outdated --depth=0
Список глобально установленных пакетов требующих обновления:
Npm outdated --depth=0 -g
Команда npm install package - позволяет установить любой пакет по его имени. Если при этом к команде добавить префикс -g пакет будет установлен глобально на весь компьютер.
Npm install PACKAGE
Npm install PACKAGE --save-dev
Глобальная установка пакета:
Npm install PACKAGE -g
И в заключение, если вы пользуетесь конролем версий Git, то незабудьте добавить в файл .gitignore исключение для папки node_modules , чтобы гит не индексировал файлы из этой папки. Для этого создайте файл .gitignore если он у вас ещё не создан и пропишите в нём отдельной строкой:
Node_modules/
Если у пакета NPM сменилась версия на мажорную, то есть была изменена первая цифра в версии пакета (например установлена версия пакета 4.19.1, а последняя версия 5.3.0), то она не обновится командой npm up . Это сделано в целях безопасности.
Для обновления мажорной версии есть такая команда:
Npm i -g npm-check-updates && ncu -a && npm i
В итоге будут обновлены все пакеты.
Делайте такое обновление только в случае если вы уверены и понимаете что делаете. Мажорная версия несёт изменения для которых есть изменения в настройках.
Посмотрите это видео, где есть понятное объяснение по версиям пакетов NPM:
n pm. это менеджер пакетов JavaScript, который может быть использован для установки, совместного использования и распространения кода, а также для управления зависимостями в ваших проектах. Он полностью написан на JavaScript, как вдохновение от других подобных проектов, как PEAR для PHP или CPAN для Perl. На этом уроке мы покажем вам, как установить npm на Ubuntu 16.04 в качестве операционной системы.
Самое первое, что вам нужно сделать, это и обновить программное обеспечение системы до последней доступной версии. Вы можете сделать это с помощью следующей команды:
Sudo apt-get update && sudo apt-get -y upgrade
Процесс обновления может занять от нескольких секунд до нескольких минут в зависимости от программного обеспечения, которое должно быть обновлено. После того, как ваша система находится в актуальном состоянии, вы можете продолжить.
npm поставляется в комплекте с Node.js, поэтому установить NPM вам нужно только если установили Node.js на вашем . Чтобы установить Node.js 4.x LTS на Ubuntu 16.04 , выполните следующие команды:
Curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash - sudo apt-get install -y nodejs
В качестве альтернативы, для установки Node.js 6.x на Ubuntu 16.04 , которая является текущей версии Node.js, выполните следующие команды:
Curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash - sudo apt-get install -y nodejs
Чтобы убедиться, что установка прошла успешно, вы можете проверить версию npm:
Выход должен быть аналогичен приведенному ниже:
# npm -v 2.15.9
Хороший способ начать использовать npm, чтобы прочитать справочную страницу npm или документацию npm. Чтобы проверить страницу npm справки, введите следующую команду:
Npm help
Вот страница npm help:
# npm help Usage: npm where is one of: access, add-user, adduser, apihelp, author, bin, bugs, c, cache, completion, config, ddp, dedupe, deprecate, dist-tag, dist-tags, docs, edit, explore, faq, find, find-dupes, get, help, help-search, home, i, info, init, install, issues, la, link, list, ll, ln, login, logout, ls, outdated, owner, pack, ping, prefix, prune, publish, r, rb, rebuild, remove, repo, restart, rm, root, run-script, s, se, search, set, show, shrinkwrap, star, stars, start, stop, t, tag, team, test, tst, un, uninstall, unlink, unpublish, unstar, up, update, upgrade, v, version, view, whoami npm -h quick help on npm -l display full usage info npm faq commonly asked questions npm help search for help on npm help npm involved overview Specify configs in the ini-formatted file: /root/.npmrc or on the command line via: npm --key value Config info can be viewed via: npm help config [email protected] /usr/lib/node_modules/npm
Документация npm доступна на
В этом руководстве я расскажу: как установить вебпак (webpack), его зависимости и настроить объединение и минимизацию скриптов через него.
Это первая часть серии "Webpack в NetBeans проекте".
1. Уже несколько раз в проектах мне понадобилось из нескольких скриптов объединять в один. Причина такого разделения - каждый скрипт выполняет свою задачу, а для уменьшения http-запросов при релизе плагина (или дополнения к WordPress плагину WP-Recall) - нужно все объединить в один. Руками это делать не хочется.
2. Я люблю комментировать js (не то чтобы маниакально, но в помощь себе - когда вернусь к нему через длительное время), а комментарии в js - это не каменты в php - в скрипте они ложатся мертвым грузом в файле и увеличивают его размер. А этот файл грузится во фронте.
3. Кто-то не хочет чтобы js был прочитан человеком. Ну мало ли... На помощь приходит "Обфуска́ция" (от лат. obfuscare - затенять, затемнять; и англ. obfuscate - делать неочевидным, запутанным, сбивать с толку) - приведение исходного текста или исполняемого кода программы к виду, сохраняющему её функциональность, но затрудняющему анализ, понимание алгоритмов работы и модификацию при декомпиляции.
Пишешь скрипты в разных файлах;
Комментируешь их "от души";
Не скупишься на названия переменным (они должны быть говорящими).
Объединяешь автоматически указанные файлы в один;
Автоматически происходит минимизация (удаление пробелов, переносов и комментариев) - скрипт идет в одну строку;
Автоматически файл обфусцируется - имена переменных сокращаются.
Всё это ведет к снижению веса файла. Что в итоге сказывается на более быстрой загрузке файла.
Посмотрите на пример (все скрины кликабельны):
Результат веса файла ~2 раза
Ну и время "расти дальше" настало. Выбор пал на webpack. Но для того чтобы его поставить придется установить терминал Cygwin в NetBeans (далее: нетбинс, ide), поставить node.js с npm (node package manager) внутри, а затем только поставить сам вебпак.
На этом приключение не закончится - в процессе запуска команды $ npm run build придется доставить webpack-command и webpack-cli - т.к. в терминале вылезет сообщение что их нет. Двинуться без этих пакетов дальше будет нельзя.
В жизни никогда через терминал и командную строку не работал. Всё на кнопочки тыкал. Но тут так не прокатит.
В ide NetBeans есть возможность работы через терминал.
Открываем любой свой проект и вот здесь он находится:
"Сервис" -> "Открыть в терминале"
Откроем терминал
При открытии терминала, ide попросит вас установить его. Вы увидите сообщение вроде этого:
установите Cygwin и перезапустите ide
Cygwin - набор утилит для работы windows через unix команды. Пакет также содержит и терминал.
На эту тему мне интересно решить еще пару-тройку вопросов:
Минимизация и объединение css через webpack;
Автопрефиксы на основе caniuse сервиса;
И конечно же компиляция jsx через babel.
Все конечно же через нетбинс. Поэтому этот урок будем считать первым из серии.
p.s. если вы заметили неточность или опечатку, у вас появились вопросы или вы хотите высказаться по текущей статье - добро пожаловать в комментарии.
Если вы работаете с webpack, но в другой ide - поделитесь своими впечатлениями в комментариях. Если еще не используете, но присматриваетесь - тоже напишите с какой ide вы будете настраивать тесную работу.
npm - это пакетный менеджер node.js . С его помощью можно управлять модулями и зависимостями.
Небольшая шпаргалка всех моих любимых команд npm:
Кроме того, поскольку http-server пакет имеет свой исполняемый файл, то этот файл также будет установлен как исполняемый http-server и доступен в командах.
Теперь вы можете просто запустить команду:
http-server
