package.json
and package-lock.json
.npm
command, you can download packages from the registry. Below we look at examples of its use.package.json
, then you can install all the dependencies of this project with the following command: npm install
node_modules
folder, creating it if it does not exist in the project directory. npm install <package-name>
--save
flag allows --save
to install a package and add an entry about it to the dependencies
section of the package.json
file, which describes the project's dependencies. These dependencies are used by the project to implement its main functionality, they are installed during its deployment on the server (after npm 5 is released, entries about installed packages in the dependency section are made automatically without using this flag).--save-dev
flag allows you to install a package and add an entry about it in a section containing a list of development dependencies (that is, packages that are needed during project development, such as libraries for testing, but not required for its operation) in the package.json
file called devDependencies
. npm update
package.json
, install them. npm update <package-name>
package.json
project file.package.json
file supports the ability to describe commands (scripts), which can be run using this construct: npm <task-name>
{ "scripts": { "start-dev": "node lib/server-development", "start": "node lib/server-production" } }
{ "scripts": { "watch": "webpack --watch --progress --colors --config webpack.conf.js", "dev": "webpack --progress --colors --config webpack.conf.js", "prod": "NODE_ENV=production webpack -p --config webpack.conf.js", } }
$ npm watch $ npm dev $ npm prod
npm install lodash
, the package is placed in the node_modules
folder located in the project folder. In addition, if the above command was executed, npm will also add an entry for the lodash
library to the dependencies
section of the package.json
file in the current directory.-g
flag: npm install -g lodash
npm root -g
/usr/local/lib/node_modules
. On Windows, this could be something like C:\Users\YOU\AppData\Roaming\npm\node_modules
./Users/flavio/.nvm/versions/node/v8.9.0/lib/node_modules
.node_modules
folders? Suppose you have installed the popular lodash
library, which contains many support functions used in JavaScript development: npm install lodash
node_modules
.require
command: const _ = require('lodash')
node_modules/.bin/ folder
.npm install cowsay
, it, along with its dependencies, will go into node_modules
. And in the hidden .bin
folder will be written symbolic links to binary files cowsay../node_modules/.bin/cowsay
to call the program, this is a working approach, but it is much better to use npx , a tool for running executable files of npm packages included in npm starting from version 5.2. Namely, in our case we need the following command: npx cowsay
package.json
file is the most important element of a multitude of projects based on the Node.js ecosystem. If you programmed in JavaScript, whether it was server-side or client-side development, then you probably already encountered this file. Why is it needed? What should you know about it and what opportunities does it give you?Package.json
is something like a manifest file for a project. It gives the developer a lot of diverse opportunities. For example, it is the central repository of settings for the tools used in the project. It is also the place where npm and yarn record information about the names and versions of installed packages.package.json
file: { }
package.json
should have a set of properties that will help other people use the package. We will talk more about this later.package.json
example: { "name": "test-project" }
name
, the value of which is the name of the application or package, the materials of which are contained in the same folder as this file. { "name": "test-project", "version": "1.0.0", "description": "A Vue.js project", "main": "src/main.js", "private": true, "scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", "start": "npm run dev", "unit": "jest --config test/unit/jest.conf.js --coverage", "test": "npm run unit", "lint": "eslint --ext .js,.vue src test/unit", "build": "node build/build.js" }, "dependencies": { "vue": "^2.5.2" }, "devDependencies": { "autoprefixer": "^7.1.2", "babel-core": "^6.22.1", "babel-eslint": "^8.2.1", "babel-helper-vue-jsx-merge-props": "^2.0.3", "babel-jest": "^21.0.2", "babel-loader": "^7.1.1", "babel-plugin-dynamic-import-node": "^1.2.0", "babel-plugin-syntax-jsx": "^6.18.0", "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0", "babel-plugin-transform-runtime": "^6.22.0", "babel-plugin-transform-vue-jsx": "^3.5.0", "babel-preset-env": "^1.3.2", "babel-preset-stage-2": "^6.22.0", "chalk": "^2.0.1", "copy-webpack-plugin": "^4.0.1", "css-loader": "^0.28.0", "eslint": "^4.15.0", "eslint-config-airbnb-base": "^11.3.0", "eslint-friendly-formatter": "^3.0.0", "eslint-import-resolver-webpack": "^0.8.3", "eslint-loader": "^1.7.1", "eslint-plugin-import": "^2.7.0", "eslint-plugin-vue": "^4.0.0", "extract-text-webpack-plugin": "^3.0.0", "file-loader": "^1.1.4", "friendly-errors-webpack-plugin": "^1.6.1", "html-webpack-plugin": "^2.30.1", "jest": "^22.0.4", "jest-serializer-vue": "^0.3.0", "node-notifier": "^5.1.2", "optimize-css-assets-webpack-plugin": "^3.2.0", "ora": "^1.2.0", "portfinder": "^1.0.13", "postcss-import": "^11.0.0", "postcss-loader": "^2.0.8", "postcss-url": "^7.2.1", "rimraf": "^2.6.0", "semver": "^5.3.0", "shelljs": "^0.7.6", "uglifyjs-webpack-plugin": "^1.1.1", "url-loader": "^0.5.8", "vue-jest": "^1.0.2", "vue-loader": "^13.3.0", "vue-style-loader": "^3.0.1", "vue-template-compiler": "^2.5.2", "webpack": "^3.6.0", "webpack-bundle-analyzer": "^2.9.0", "webpack-dev-server": "^2.9.1", "webpack-merge": "^4.1.0" }, "engines": { "node": ">= 6.0.0", "npm": ">= 3.0.0" }, "browserslist": [ "> 1%", "last 2 versions", "not ie <= 8" ] }
name
- sets the name of the application (package).version
- contains information about the current version of the application.description
- a brief description of the application.main
- sets the entry point to the application.private
- if this property is set to true
, this prevents the package from being accidentally published to npm.scripts
- sets a set of Node.js scripts that can be run.dependencies
- contains a list of npm-packages on which the application depends.devDependencies
- contains a list of npm-packages used during project development, but not during its actual operation.engines
- sets the list of Node.js versions on which the application runs.browserlist
- used to store the list of browsers (and their versions) that the application should support.package.json
. Here we will use the term “package”, but everything that is said about packages is also true for local applications that are not planned to be used as packages.name
property specifies the name of the package: "name": "test-project"
-
) and underscores ( _
).author
property contains information about the author of the package: { "author": "Flavio Copes <flavio@flaviocopes.com> (https://flaviocopes.com)" }
{ "author": { "name": "Flavio Copes", "email": "flavio@flaviocopes.com", "url": "https://flaviocopes.com" } }
contributors
property contains an array with information about the people who contributed to the project: { "contributors": [ "Flavio Copes <flavio@flaviocopes.com> (https://flaviocopes.com)" ] }
{ "contributors": [ { "name": "Flavio Copes", "email": "flavio@flaviocopes.com", "url": "https://flaviocopes.com" } ] }
bugs
property contains a link to the project's bug tracker; it’s very likely that such a link will lead to the GitHub bug tracking system page: { "bugs": "https://github.com/flaviocopes/package/issues" }
homepage
property allows you to set the package home page: { "homepage": "https://flaviocopes.com/package" }
version
property contains information about the current version of the package: "version": "1.0.0"
license
property contains package license
information: "license": "MIT"
keywords
property contains an array of keywords related to the functionality of the package: "keywords": [ "email", "machine learning", "ai" ]
description
property contains a brief description of the package: "description": "A package to work with strings"
repository
property indicates where the package repository is located: "repository": "github:flaviocopes/testing",
github
prefix. Npm supports prefixes for some other popular services of this kind: "repository": "gitlab:flaviocopes/testing", "repository": "bitbucket:flaviocopes/testing",
"repository": { "type": "git", "url": "https://github.com/flaviocopes/testing.git" }
"repository": { "type": "svn", "url": "..." }
main
property sets the entry point to the package: "main": "src/main.js"
private
property is set to true
to prevent the package from being accidentally published to npm: "private": true
scripts
property specifies a list of scripts or utilities that can be run using npm tools: "scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", "start": "npm run dev", "unit": "jest --config test/unit/jest.conf.js --coverage", "test": "npm run unit", "lint": "eslint --ext .js,.vue src test/unit", "build": "node build/build.js" }
npm run XXXX
or yarn XXXX
, where XXXX
is the name of the script. For example, it may look like this: npm run dev
dependencies
property contains a list of npm packages installed as package dependencies: "dependencies": { "vue": "^2.5.2" }
npm install <PACKAGENAME> yarn add <PACKAGENAME>
devDependencies
property contains a list of npm packages installed as development dependencies: "devDependencies": { "autoprefixer": "^7.1.2", "babel-core": "^6.22.1" }
dependencies
property, since the packages it contains are installed only in the package developer’s system; they are not used in practical use of the package. npm install --dev <PACKAGENAME> yarn add --dev <PACKAGENAME>
engines
property indicates which versions of Node.js and other software products are used to make the package work: "engines": { "node": ">= 6.0.0", "npm": ">= 3.0.0", "yarn": "^0.13.0" }
browserlist
property allows browserlist
to report which browsers (and their versions) the developer of the package is going to support: "browserslist": [ "> 1%", "last 2 versions", "not ie <= 8" ]
browserlist
property shown here as an example means that you want to support at least 2 major versions of all browsers with at least 1% of use (this data is taken from CanIUse.com ), except for IE 8 and older versions of this browser (for details this can be found on the browserlists package page ).package.json
you can store settings for various auxiliary tools like Babel or ESLint.eslintConfig
or babel
. Details on the use of such properties can be found in the documentation of the relevant projects.~3.0.0
^0.13.0
. , , .~
: ~0.13.0
, - . , 0.13.1
, 0.14.0
— .^
: ^0.13.0
, , - . , 0.13.1
, 0.14.0
, .*
: , , , — .>
: , .>=
: , .<=
: , .<
: , .=
: .-
: , — 2.1.0 - 2.6.2
.||
: , . < 2.1 || > 2.6
.latest
: , .1.0.0 || >=1.1.0 <1.2.0
, 1.0.0
, , 1.1.0
, 1.2.0
.package-lock.json
npm 5. Node.js-. ? , package.json
, .package.json
. package.json
, (- ) .node_modules
, . , npm install
, , , ~
, -, , , -.^
. , , , .npm install
. , . , , - , , , ( ) .package-lock.json
npm npm install
.package-lock.json
Git-, , , , , Git .package-lock.json
npm update
.package-lock.json
, cowsay, npm install cowsay
: { "requires": true, "lockfileVersion": 1, "dependencies": { "ansi-regex": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3. 0.0.tgz", "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=" }, "cowsay": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/cowsay/-/cowsay-1.3.1.tgz" , "integrity": "sha512-3PVFe6FePVtPj1HTeLin9v8WyLl+VmM1l1H/5P+BTTDkM Ajufp+0F9eLjzRnOHzVAYeIYFF5po5NjRrgefnRMQ==", "requires": { "get-stdin": "^5.0.1", "optimist": "~0.6.1", "string-width": "~2.1.1", "strip-eof": "^1.0.0" } }, "get-stdin": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-5.0. 1.tgz", "integrity": "sha1-Ei4WFZHiH/TFJTAwVpPyDmOTo5g=" }, "is-fullwidth-code-point": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/ is-fullwidth-code-point-2.0.0.tgz", "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=" }, "minimist": { "version": "0.0.10", "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10 .tgz", "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=" }, "optimist": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz", "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=", "requires": { "minimist": "~0.0.1", "wordwrap": "~0.0.2" } }, "string-width": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz", "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==", "requires": { "is-fullwidth-code-point": "^2.0.0", "strip-ansi": "^4.0.0" } }, "strip-ansi": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz", "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=", "requires": { "ansi-regex": "^3.0.0" } }, "strip-eof": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz", "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=" }, "wordwrap": { "version": "0.0.3", "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz", "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc=" } } }
requires
, :version
, resolved
, , integrity
, .package.json
package-lock.json
. npm npx.Source: https://habr.com/ru/post/423703/
All Articles