Использование npm

License

(The MIT License)

Copyright (c) 2011 LearnBoost dev@learnboost.com>

Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
‘Software’), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:

The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED ‘AS IS’, WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Собираем js

Будем используем ES6-синтаксис – понадобится соответствующий плагин, чтобы сохранить кроссбраузерность приложения. Ставим Babel (занимается преобразованием ES6 в ES5):

npm i babel-core
npm i gulp-babel babel-preset-env

Подключаем Babel:

const babel = require('gulp-babel');

Напишем задачу ‘js’, которая будет обрабатывать js-файлы:

gulp.task('js', function () {
    return gulp.src('./src/js/**/*.js')
        .pipe(babel({
            presets: 
        }))
        .pipe(gulp.dest(`${config.build}/js`))
});

Все аналогично задаче css, только вместо postcss в дело вступает babel.

Напишем простенький js-файл с ES6-кодом (пусть это будет script.js, размещенный в папке src/js). Испытаем работу таска:

function hello(name) {
    return `Hello! ${name}`;
}

console.log(hello('Петя!'));

Выполним задачу:

gulp js

Результатом будет файл script.js в папке build/js со следующим содержанием:

'use strict';

function hello() {
    var name = arguments.length >  && arguments[] !== undefined ? arguments[] : 'n/a';

    return 'Hello! ' + name;
}

console.log(hello('Петя'));

В результате работы Babel код немного усложнился по сравнению с исходным.

С одним файлом все хорошо, но что произойдет, если их будет 2, 3, 10 и больше? Совсем неудобно все это подключать к странице. Эту проблему поможет решить модуль gulp-concat.

Поставим его:

npm i gulp-concat

Скорректируем gulpfile:

const concat = require('gulp-concat');

Доработаем таск js:

gulp.task('js', function () {
    return gulp.src(`${config.src}/js/**/*.js`)
        .pipe(babel({
            presets: 
        }))
        .pipe(concat('main.js'))
        .pipe(gulp.dest(`${config.build}/js`))
});

Теперь concat(‘main.js’) объединяет все файлы в один – main.js, который удобно подключать к странице (попробуйте создать несколько файлов и понаблюдайте за результатом).

Научившись обрабатывать стили, JavaScript-код, вы все еще каждый раз набираете gulp ‘task’ в консоли. Это не очень удобно. Можно ли объединить все в одной задаче?

Да, и прежде чем это сделать, напишем еще пару вспомогательных тасков для очистки папки сборки и переноса остальных файлов (html, картинок, шрифтов и т.д.).

Ставим ‘del’:

npm i del

Подключаем:

const del = require('del');

Напишем задачи ‘clr’ и ‘assets’. Первая будет вычищать папку build перед сборкой, а вторая – просто переносить файлы.

gulp.task('clr', function () {
    return del('${config.build}/*')
});
gulp.task('assets', function () {
    return gulp.src('./src/assets/**')
        .pipe(gulp.dest('./build/'));
});

Создадим отдельный таск для html:

gulp.task('html', function () {
    return gulp.src(`${config.src}/assets/*.html`)
        .pipe(gulp.dest('./build'))
});

Теперь можем вычищать нашу директорию сборки и переносить остальные файлы. Но при разработке изменения происходят во многих файлах, и каждый раз нужно пересобирать проект вручную. Чтобы избавиться от этой рутины, воспользуемся методом gulp.watch.

Напишем задачу ‘watch’, которая будет отслеживать изменения в нужных файлах и при необходимости запускать соответствующие таски:

gulp.task('watch', function () {
    gulp.watch(`${config.src}/pcss/**/*.pcss`, gulp.series('css'));
    gulp.watch(`${config.src}/js/**/*.js`, gulp.series('js'));
    gulp.watch(`${config.src}/assets/*.html`, gulp.series('html'));
});

В данной задаче мы следим за изменениями в файлах стилей, скриптов и html.

Осталось написать задачу для первичной сборки – назовем ее ‘build’, а также задачу ‘default’, которая позволит, просто набрав команду ‘gulp’, собрать проект и запустить «вотчеры».

Задача ‘build’:

gulp.task('build', gulp.series(
    'clr',
    gulp.parallel('css', 'js', 'assets', 'html')
));

Используем метод .parallel, чтобы ускорить процесс и запустить все задачи в параллельных потоках.

Задача ‘default’:

gulp.task('default', gulp.series('build', gulp.parallel('watch', 'server')));

Метод .series запускает задачи последовательно: сначала выполнится ‘build’, а далее параллельно стартуют ‘watch’ и ‘server’.

USAGE

const pacote = require('pacote')

// get a package manifest
pacote.manifest('foo@1.x').then(manifest => console.log('got it', manifest))

// extract a package into a folder
pacote.extract('github:npm/cli', 'some/path', options)
  .then(({from, resolved, integrity}) => {
    console.log('extracted!', from, resolved, integrity)
  })

pacote.tarball('https://server.com/package.tgz').then(data => {
  console.log('got ' + data.length + ' bytes of tarball data')
})

Anything that you can do to with kind of package, you can do to any kind of
package. Data that isn’t relevant (like a packument for a tarball) will be
simulated.

Packuments

A packument is the top-level package document that lists the set of
manifests for available versions for a package.

When a packument is fetched with in the HTTP headers, only the most
minimum necessary metadata is returned. Additional metadata is returned
when fetched with only .

For Pacote’s purposes, the following fields are relevant:

  • An object where each key is a version, and each value is the
    manifest for that version.
  • An object mapping dist-tags to version numbers. This is how
    gets turned into .
  • In the full packument, an object mapping version numbers to
    publication times, for the functionality.

Extracted File Modes

Files are extracted with a mode matching the following formula:

This is in order to prevent unreadable files or unlistable directories from
cluttering a project’s folder, even if the package tarball
specifies that the file should be inaccessible.

It also prevents files from being group- or world-writable without explicit
opt-in by the user, because all file and directory modes are masked against
the value.

So, a file which is in the tarball, using the default of
and of , will result in a file mode of :

In almost every case, the defaults are appropriate. To respect exactly
what is in the package tarball (even if this makes an unusable system), set
both and options to . Otherwise, the config
should be used in most cases where file mode modifications are required,
and this functions more or less the same as the value in most Unix
systems.

package.json¶

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

Вам будет предложено ввести некоторые данные, на основе которых Node.js npm сгенерирует файл . Структура файла:

  • — название приложения;
  • — версия;
  • — описание;
  • — главный файл приложения, который отвечает за его запуск (хорошей практикой считается давать название или );
  • — объект, описывающий команды, которые часто приходится выполнять в процессе разработки и упрощающий их использование;
  • — ссылка на Git репозиторий, где хранится проект;
  • — массив ключевых слов, по которым будет осуществляться поиск модуля на сайте npm (если он будет там опубликован);
  • — разработчик;
  • — лицензия, под которой будет распространяться приложение.

Пример, как может выглядеть .

package.json

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

Усложняемся – работаем с препроцессором

Создадим что-то более сложное и функциональное, а попутно познакомимся с оставшимися методами Gulp.

Выстраиваем структуру папок. При разработке принято хранить исходники и сборку в разных папках. Создаем их: src для исходных материалов и build для готовой сборки.

Чтобы усложнить задачу, добавим в разработку препроцессор pcss (CSS-препроцессор). Это надстройка, которая с помощью новых синтаксических конструкций добавляет CSS ранее недоступные возможности. Происходит преобразование кода, написанного с использованием препроцессорного языка, в чистый и валидный CSS-код.

Установим препроцессор и несколько вспомогательных библиотек для работы с css.

Ставим сам препроцессор:

npm i gulp-postcss

Далее устанавливаем autoprefixer, cssnext и precss

npm i autoprefixer
npm i cssnext
npm I precss

В файле package.json появляются следующие строки:

"gulp-postcss": "^7.0.0",
"autoprefixer": "^7.1.6",
"cssnext": "^1.8.4",
"precss": "^2.0.0"
"gulp-dest": "^0.2.3",

Понимаете, для чего это нужно? Скоро сами удивитесь, как это полезно.

Подключаем препроцессор и дополнительные модули (в начале файла):

const postcss = require('gulp-postcss');
const autoprefixer = require('autoprefixer');
const cssnext = require('cssnext');
const precss = require('precss');
const dest = require('gulp-dest');

Создадим в src папку pcss, где будем хранить стили. Добавим файл style.pcss и опишем несколько стилей в синтаксисе pcss:

* {
 padding: ;
 margin: ;
}

.firstClass {
 background: #f00;

 &__active {
   border: 1px solid #000;

   &-on {
     border-color: #0f0;
   }
 }
}

.hello {
 font-size: 60px;
 color: #000000;
}

Файл готов! Создадим «таск», который будет переписывать pcss в css и класть в папку build/css. Для удобства работы с директориями добавим в gulpfile объект конфигурации:

const config = {
   src: "./src", // директория с исходниками
   build: "./build" // Директория сборки
};

Теперь напишем сам таск и назовем его «css»:

gulp.task('css', function () {
   const processors = ;
   return gulp.src(`${config.src}/pcss/**/*.pcss`)
       .pipe(postcss(processors))
       .pipe(dest('css', {ext: '.css'}))
       .pipe(gulp.dest(config.build))
});

Разберемся, что тут происходит:

const processors = ;

Задан массив с дополнительными модулями для нашего postcss. Далее идет возврат (return) «цепочки» потоков (.pipe в каждом таком потоке выполняются какие-то задачи).

Метод .src у gulp указывает, откуда брать файлы для обработки (/**/*.pcss говорит о том, что нужно сканировать текущую и все вложенные папки на наличие файлов с расширением pcss).

Gulp.dest задает, куда положить результат обработки. Postcss вызывает обработку .pcss-файлов с параметрами из processors. dest (не путать с gulp.dest), дает возможность задать расширение выходного файла (в нашем случае – .css) и папку, в которую нужно положить файл.

Задача написана – протестируем ее! Набираем в консоли:

gulp css

Наблюдаем следующее:

$ gulp css
 Using gulpfile ~/Downloads/frontend/gulpfile.js
 Starting 'css'...
 Finished 'css' after 1.08 s

Переходим в build и видим, что там появилась папка css, а в ней – файл style.css с таким содержанием:

* {
  padding: ;
  margin: ;
}

.firstClass {
  background: #f00;
}

.firstClass__active {
    border: 1px solid #000;
  }

.firstClass__active-on {
      border-color: #0f0;
    }

.hello {
  font-size: 60px;
  color: #000000;
}

Перед нами привычный CSS-код, который можно подключить html-файлу.

Команды npm¶

NPM позволяет определять в файле команды, которые выполняют определенные действия. Например, определим следующий файл :

В данном случае мы получаем переданные при запуске приложению параметры.

И определим следующий файл :

Здесь добавлена секция , которая определяет две команды. Вообще команд может быть много в соответствии с целями и задачами разработчика.

Первая команда называется . Она по сути выполняет команду , которая выполняет код в файле

Вторая команда назвывается . Она также выполняет тот же файл, но при этом также передает ему два параметра.

Названия команд могут быть произвольными. Но здесь надо учитывать один момент. Есть условно говоря есть зарезервированные названия для команд, например, , , и ряд других. Их не очень много. И как раз первая команда из выше определенного файла называется . И для выполнения подобных команд в терминале/командной строке надо выполнить команду

Например, для запуска команды

Команды с остальными названия, как например, в вышеопределенном файле, запускаются так:

Например, последовательно выполним обе команды:

Usage

This utility is supposed to be run in the root directory of your Node.js project (that contains ).
Run to see all available top-level commands:

Run to see usage help for corresponding command.
is the default command and can be omitted so running is the same as .

It will find all your outdated deps and will ask to updated their versions in , one by one.
For example, here is what you will see if you use outdated version of module:

  • will update version in to , but not immediately (see explanation below)
  • will not update this module version.
  • will try to find changelog url for the current module and open it in default browser.
  • will …hm… finish update process and save all the changes to .

A note on saving changes to : when you choose to update some module’s version, won’t be immediately updated. It will be updated only after you will process all the outdated modules and confirm update or when you choose . So if in the middle of the update process you’ve changed your mind just press and will remain untouched.

If you want to check only some deps, you can use argument:

npm-upgrade babel-corenpm-upgrade '*babel*'npm-upgrade '!*babel*'npm-upgrade '*babel* !babel-transform-* !babel-preset-*'

If you want to check only a group of deps use these options:

Sometimes you just want to ignore newer versions of some dependency for some reason. For example, you use because of the old IE support and don’t want to suggest you updating it to . Or you use and know that the new version contains a bug that breaks your app.

You can handle these situations by ignoring such modules. You can do it in two ways: choosing during update process or using command.

  • — will ignore only version . When the next version after will be published will suggest to update it. Can be used in example above.
  • — will ignore all versions starting from . Can be used in example above.
  • — will ignore all and versions.
  • — will ignore all new versions.

And after that will ask about the ignore reason. The answer is optional but is strongly recommended because it will help to explain your motivation to your сolleagues and to yourself after a few months.

All the data about ignored modules will be stored in file next to your project’s .

  • — will add a module from your deps to ignored list. You can either provide module name as optional argument or interactively select it from the list of project’s deps.
  • — will show the list of currently ignored modules along with their ignored versions and reasons.
  • — will remove modules from the ignored list. You can either provide module names as argument (separated by space) or interactively select them from the list of project’s deps.

Will try to find changelog url for provided module and open it in default browser.

API

The refers to any kind of package specifier that npm can install.
If you can pass it to the npm CLI, you can pass it to pacote. (In fact,
that’s exactly what the npm CLI does.)

See below for valid values.

  • Resolve a specifier like or
    all the way to a tarball url, tarball file, or git
    repo with commit hash.

  • Extract a package’s tarball into a
    destination folder. Returns a promise that resolves to the
    of the extracted package.

  • Fetch (or simulate) a package’s manifest
    (basically, the file, plus a bit of metadata).
    See below for more on manifests and packuments. Returns a Promise that
    resolves to the manifest object.

  • Fetch (or simulate) a package’s packument
    (basically, the top-level package document listing all the manifests that
    the registry returns). See below for more on manifests and packuments.
    Returns a Promise that resolves to the packument object.

  • Get a package tarball data as a buffer in
    memory. Returns a Promise that resolves to the tarball data Buffer, with
    , , and fields attached.

  • Save a package tarball data to
    a file on disk. Returns a Promise that resolves to
    of the fetched tarball.

  • Fetch a tarball and
    make the stream available to the function.

    This is mostly an internal function, but it is exposed because it does
    provide some functionality that may be difficult to achieve otherwise.

    The function MUST return a Promise that resolves when
    the stream (and all associated work) is ended, or rejects if the stream
    has an error.

    The function MAY be called multiple times, as Pacote
    retries requests in some scenarios, such as cache corruption or
    retriable network failures.

Options

Options object is cloned, and mutated along the way to add integrity,
resolved, and other properties, as they are determined.

  • Base folder for resolving relative dependencies.
  • Shortcut for looking up resolved values. Should be specified
    if known.
  • Expected integrity of fetched package tarball. If specified,
    tarballs with mismatched integrity values will raise an
    error.
  • Permission mode mask for extracted files and directories.
    Defaults to . See «Extracted File Modes» below.
  • Minimum permission mode for extracted files. Defaults to
    . See «Extracted File Modes» below.
  • Minimum permission mode for extracted directories. Defaults to
    . See «Extracted File Modes» below.
  • Prefer to revalidate cache entries, even when it would not
    be strictly necessary. Default .
  • When picking a manifest from a packument, only consider
    packages published before the specified date. Default .
  • The default to use when choosing a manifest from a
    packument. Defaults to .
  • The npm registry to use by default. Defaults to
    .
  • Fetch the full metadata from the registry for packuments,
    including information not strictly required for installation (author,
    description, etc.) Defaults to when is set, since the
    version publish time is part of the extended packument metadata.

DESCRIPTION

Executes either from a local , or from a central cache, installing any packages needed in order for to run.

By default, will check whether exists in , or in the local project binaries, and execute that. If is not found, it will be installed prior to execution.

Unless a option is specified, will try to guess the name of the binary to invoke depending on the specifier provided. All package specifiers understood by may be used with , including git specifiers, remote tarballs, local directories, or scoped packages.

If a full specifier is included, or if is used, npx will always use a freshly-installed, temporary version of the package. This can also be forced with the flag.

  • — define the package to be installed. This defaults to the value of . This is only needed for packages with multiple binaries if you want to call one of the other executables, or where the binary name does not match the package name. If this option is provided will be executed as-is, without interpreting if it’s there. Multiple options may be provided, and all the packages specified will be installed.

  • — If passed to , it will only try to run if it already exists in the current path or in . It won’t try to install missing commands.

  • — set the location of the npm cache. Defaults to npm’s own cache settings.

  • — path to the user configuration file to pass to npm. Defaults to whatever npm’s current default is.

  • — Execute inside an -like shell environment, with all the usual environment variables available. Only the first item in will be automatically used as . Any others must use .

  • — The shell to invoke the command with, if any.

  • — Generates shell code to override your shell’s «command not found» handler with one that calls . Tries to figure out your shell, or you can pass its name (either , , or ) as an option. See below for how to install.

  • — If this flag is set, npx will not look in , or in the current package’s for an existing version before deciding whether to install. Binaries in those paths will still be available for execution, but will be shadowed by any packages requested by this install.

  • — Suppressed any output from npx itself (progress bars, error messages, install reports). Subcommand output itself will not be silenced.

  • — Extra node argument to supply to node when binary is a node script. You can supply this option multiple times to add more arguments.

  • — Show the current npx version.

Пакетный менеджер NPM

lass=»date»>Последнее обновление: 16.12.2019

В прошлой теме было рассмотрено, как для управления пакетами клиентской стороны (то есть библиотеками javascript и css) в ASP.NET Core
можно использовать менеджер Libman. Но мы также можем использовать и другой более привычный для мира фронтенд-разработки менеджер пакетов — NPM.

К примеру создадим новый проект ASP.NET Core по типу Empty. В приницпе можно выбрать в качестве типа Web Application, но в данном случае разницы никакой нет, так как он
тоже по умолчанию не содержит функциональность NPM.

В первую очередь добавим в проект новый элемент npm Configuration File. Назовем его package.json:

После добавления откроем этот файл:

{
	"version": "1.0.0",
	"name": "asp.net",
	"private": true,
	"devDependencies": {
	}
}

Изменим этот файл, добавив в него пакеты jquery и bootstrap:

{
	"version": "1.0.0",
	"name": "asp.net",
	"private": true,
  "dependencies": {
    "jquery": "2.2.0",
    "bootstrap": "3.3.6"
  }
}

Определение каждого пакета содержится в виде: .

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

Во-вторых, если мы нажмем на кноку Show All Files, то также в проекте мы увидим скрытый узел node_modules,
который будет представлять физическую папку, в которой хранятся все файлы добавленных пакетов:

Теперь используем добавленные библиотеки в проекте. Для этого добавим в проект папку wwwroot и определим в ней новый файл index.html:

METANIT.COMИспользуем NPM
    
    


На странице подключаются ранее добавленные библиотеки с помощью путей, начинающихся с названи каталога . Однако по умолчанию
в ASP.NET Core нам доступна только директория wwwroot, и собственно все файлы js и css лучше размещать в wwwroot. И пока добавленные файлы css и js для страницы
index.html не существуют. Поэтому изменим класс Startup:

using System.IO;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.FileProviders;

namespace NpmEmptyApp
{
    public class Startup
    {
        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            app.UseDeveloperExceptionPage();

            // подключаем файлы по умолчанию
            app.UseDefaultFiles();
            // подключаем статические файлы
            app.UseStaticFiles();
            // добавляем поддержку каталога node_modules
            app.UseFileServer(new FileServerOptions()
            {
                FileProvider = new PhysicalFileProvider(
                    Path.Combine(env.ContentRootPath, "node_modules")
                ),
                RequestPath = "/node_modules",
                EnableDirectoryBrowsing = false
            });
        }
    }
}

Последний вызов позволит сопоставлять все запросы с «/node_modules» с каталогом «node_modules».

В реальности, конечно, в большинстве случаев для библиотек из node_modules используют минификацию/бандлинг с помощью Grunt/Gulp, либо с помощью BundleConfig из первой тему этой главы с последующим копированием в папку wwwroot, поэтому не придется
прибегать к проекции запросов на каталог node_modules. Но тем не менее так мы тоже можем обращаться к файлам в каталоге node_modules.

И теперь при обращении к приложению мы увидим нашу страницу index.html, к которой будут применяться стили bootstrap:

НазадВперед

PFAQ: Potential Frequently Asked Questions

Cool. Send a PR! It might get denied if it is a specific vendor key of an unpopular project (e.g. ). We sort keys like «browserify» because it is a project with millions of users. If your project has, say, over 100 users, then we’ll add it. Sound fair?

Could be. I wanted this one because at the time of writing, nothing is:

  • Zero config
  • Able to be used in a library
  • Quiet (i.e. not spitting out annoying log messages, when used in a library mode)

Well, it’s nice to have the keys of a package.json in a well sorted order. Almost everyone would agree having «name» at the top of a package.json is sensible (rather than sorted alphabetically or somewhere silly like the bottom), so why not the rest of the package.json?

Интересное

Инициализация нового пакета

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

Доступные скрипты

При работе над новым проектом вы, скорее всего, интересуетесь, что вообще можно запустить в его рамках. Можно открыть файл и проверить секцию :Но список доступных скриптов можно получить и через :Еще вариант — установить интерактивное меню  () и запустить в папке проекта:

Установленные пакеты

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

Запуск локально установленных исполняемых модулей

Мы установили пакет, в нем есть исполняемый модуль, но он работает только при запуске через npm-скрипты. Почему это так, и как этого избежать?

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

При запуске исполняемых модулей через npm-скрипты менеджер пакетов добавляет дополнительную папку к , . Её можно найти, запустив . С помощью  можно увидеть все доступные переменные окружения.

Соревнование Moscow CTF School 2020

5 апреля в 10:00, онлайн, беcплатно

tproger.ru

События и курсы на tproger.ru

В  локально установленные пакеты размещают свои исполняемые модули. Запускаем  в директории проекта:

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

Найти пакет в Интернете

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

Запуск скриптов до и после других скриптов

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

Обновить версию пакета

Допустим, вы используете semver для управления версиями и хотите обновить версию перед очередным релизом. Можно открыть  и сделать это вручную, но зачем?

Более простой способ — запустить команду  с ,  или :

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

DESCRIPTION

Executes either from a local , or from a central cache, installing any packages needed in order for to run.

By default, will check whether exists in , or in the local project binaries, and execute that. If is not found, it will be installed prior to execution.

Unless a option is specified, will try to guess the name of the binary to invoke depending on the specifier provided. All package specifiers understood by may be used with , including git specifiers, remote tarballs, local directories, or scoped packages.

If a full specifier is included, or if is used, npx will always use a freshly-installed, temporary version of the package. This can also be forced with the flag.

  • — define the package to be installed. This defaults to the value of . This is only needed for packages with multiple binaries if you want to call one of the other executables, or where the binary name does not match the package name. If this option is provided will be executed as-is, without interpreting if it’s there. Multiple options may be provided, and all the packages specified will be installed.

  • — If passed to , it will only try to run if it already exists in the current path or in . It won’t try to install missing commands.

  • — set the location of the npm cache. Defaults to npm’s own cache settings.

  • — path to the user configuration file to pass to npm. Defaults to whatever npm’s current default is.

  • — Execute inside an -like shell environment, with all the usual environment variables available. Only the first item in will be automatically used as . Any others must use .

  • — The shell to invoke the command with, if any.

  • — Generates shell code to override your shell’s «command not found» handler with one that calls . Tries to figure out your shell, or you can pass its name (either , , or ) as an option. See below for how to install.

  • — If this flag is set, npx will not look in , or in the current package’s for an existing version before deciding whether to install. Binaries in those paths will still be available for execution, but will be shadowed by any packages requested by this install.

  • — Suppressed any output from npx itself (progress bars, error messages, install reports). Subcommand output itself will not be silenced.

  • — Extra node argument to supply to node when binary is a node script. You can supply this option multiple times to add more arguments.

  • — Show the current npx version.

Ссылка на основную публикацию