了解 npm 的二三事

了解 npm 的二三事

什麼是 NPM

如果你有寫過 python ,你應該會很熟悉 pip ,pip 是一個 python 的套件管理系統。(pip is package management system used to install and manage software packages written in Python. --from Wikipedia)
那什麼是 npm 呢?
就是 Node.js 的 套件管理系統啦!
(A default package manager for the JavaScript runtime environment Node.js -- from Wikipedia)
NPM 全名 Node Package Manager

  • 什麼是"套件管理系統"?
    • A package manager is a set of tools that automates and manages computer software. They deal with packages, or collections, of bundled files. Package managers make it easy to install, upgrade, or remove software for a computer's operating system. -- from Wikipedia
    • List of package manager:
      • Ubuntu: apt, dpkg
      • macOS: Homebrew
      • Application-level Dependency managers:
        • Java: Maven
        • Python: pip
        • Ruby: RubyGems
        • JavaScript: npm, yarn, Bower
  • 什麼是 Node.js?
    • Node.js is an open-source, cross-platform JavaScript run-time environment for executing JavaScript code server-side.
    • Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient.
      採用Google開發的V8執行程式碼,使用事件驅動、非阻塞和非同步輸入輸出模型等技術來提高效能,可優化應用程式的傳輸量和規模。
  • Three distinct pieces of npm:
    • website: serves as the primary tool for users to discover packages
    • registry: a large database of information about packages
    • CLI: how developers publish their packages on the registry or download packages they wish to install

      {%youtube x03fjb2VlGY %}

Ref:
[1] https://docs.npmjs.com/getting-started
[2] https://en.wikipedia.org/wiki/Package_manager
[3] https://en.wikipedia.org/wiki/List_of_software_package_management_systems
[4] https://nodejs.org/en/about/
[5] https://github.com/nodejs/node

npm 環境安裝

Installing NVM
- NVM: Node Version Manager - Simple bash script to manage multiple active node.js versions
在 Linux 環境

$ cd ~/
$ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh | bash
$ nvm install 4
$ nvm ls
$ . ~/.bashrc 
$ mkdir ~/node_modules

Ref: https://github.com/creationix/nvm

如何使用 npm

CLI Commands

npm install


Install npm packages
- 用法

$ npm install <package_name> # install package locally
$ npm i <package_name> # 與上面相同
$ npm i -g <package_name> # installs the current package as a global package
$ npm install <url>
$ npm install [<@scope>/]<name>@<version>
...
  • 範例
$ npm install jquery
$ npm install jquery@2.1.1
$ npm i jquery
$ npm i -g glob
$ npm install git+https://isaacs@github.com/npm/npm.git

Ref: https://docs.npmjs.com/cli/install

npm update

(like pip update)
Update all the packages listed to the latest version (specified by the tag config), respecting semver.
- 用法

$ npm update <package_name> 
$ npm update
$ npm update -g
...

Ref: https://docs.npmjs.com/cli/update

npm test

This runs a package's "test" script, if one was provided.
- 用法

$ npm test
$ npm t
...

Ref: https://docs.npmjs.com/cli/test

npm view

shows data about a package and prints it to the stream referenced by the outfd config, which defaults to stdout.
- 用法

$ npm view [<@scope>/]<name>[@<version>] [<field>[.<subfield>]...]
$ npm v [<@scope>/]<name>[@<version>] [<field>[.<subfield>]...]
  • 範例
$ npm view ronn@0.3.5
$ npm v cta versions
[ '0.1.0', '0.2.0', '0.3.0', '0.3.1', '0.3.2' ]

Ref: https://docs.npmjs.com/cli/view

Using the installed package

via interactive CLI

  • 範例
    like $python -> import xxx
$ npm i random-js
$ node
> random = require("random-js")();
Random { engine: [Function] }
> value = random.integer(1, 100);
20
> value = random.integer(1, 100);
9
  • 如同 python 的範例方法
$ python
Python 2.7.14 (default, Sep 23 2017, 22:06:14)
[GCC 7.2.0] on linux2
Type "help", "copyright", "credits" or "license" for more information.
>>> import random
>>> random.randint(1, 10)
8
>>> random.randint(1, 10)
6

via CLI: Using global installed package

  • 範例
$ npm install uglify-js -g
$ uglifyjs [input files] [options]
  • 如同 python 的範例
$ python -m pip install flake8
$ flake8 path/to/code/to/check.py

via programming

Node 範例

  • index.js
var random = require("random-js")(); // uses the nativeMath engine
var value = random.integer(1, 100);
console.log(value);
  • Run
$ node index.js
2

如同 Python 的範例

  • index.py
import random
print random.randint(1, 100)
  • Run
$ python index.py
65

Ref:
[1] https://github.com/ckknight/random-js
[2] https://github.com/mishoo/UglifyJS2
[3] http://flake8.pycqa.org/en/latest/
https://docs.npmjs.com/files/package.json#dependencies

What is package.json

  • To manage locally installed npm packages
  • 好處:
    1. It serves as documentation for what packages your project depends on.
    2. It allows you to specify the versions of a package that your project can use using semantic versioning rules.
    3. It makes your build reproducible, which means that it's much easier to share with other developers.

What is Json

  • A lightweight data-interchange format
  • JSON is built on two structures:
    • A collection of name/value pairs. In various languages, this is realized as an object, record, struct, dictionary, hash table, keyed list, or associative array.
    • An ordered list of values. In most languages, this is realized as an array, vector, list, or sequence.
  • 格式
    • Object: An unordered set of name/value pairs.
    • array: An ordered collection of values
    • value

The requirements of package.json

  • Create your own package.json
$ npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.
See `npm help json` for definitive documentation on these fields
and exactly what they do.
Use `npm install <pkg> --save` afterwards to install a package and
save it as a dependency in the package.json file.
Press ^C at any time to quit.
name: (aaa) my-awesome-package
version: (1.0.0)
description: This is my first awesome package
entry point: (index.js)
test command: echo \"Error: no test specified\" && exit 1
git repository: git+https://github.com/sufuf3/myjson.git
keywords: json, awesome
author: sufuf3
license: (ISC)
About to write to /Users/sufuf3149/node_modules/aaa/package.json:
{
"name": "my-awesome-package",
"version": "1.0.0",
"description": "This is my first awesome package",
"main": "index.js",
"scripts": {
"test": "echo \\\"Error: no test specified\\\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/sufuf3/myjson.git"
},
"keywords": [
"json",
"awesome"
],
"author": "sufuf3",
"license": "ISC",
"bugs": {
"url": "https://github.com/sufuf3/myjson/issues"
},
"homepage": "https://github.com/sufuf3/myjson#readme"
}
Is this ok? (yes) yes
  • example
{
"name": "my_package",
"description": "",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "https://github.com/sufuf3/my_package.git"
},
"keywords": [
"video",
"player",
"h5",
"hls",
"mp4",
"flv"
],
"author": "sufuf3",
"license": "ISC",
"homepage": "https://github.com/ashleygwilliams/my_package"
}

Ref:
[1] https://docs.npmjs.com/getting-started/using-a-package.json
[2] https://docs.npmjs.com/files/package.json
[3] https://www.json.org/

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *