nodejs-npm包管理

Node.js

簡介

官網：nodejs.org

打開應用

• 打開終端：cmd
• 打開畫圖：mspaint
• 打開計算器：calc
• 寫字板：whrite
• 打開環境變量：sysdm.cpl

node是什么？

• Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

  • Node.js不是一門語言
  • Node.js不是庫，不是框架
  • Node.JS是一個javascript運行時環境
  • 簡單點絳就是Node.js可以解析和執行Javascript代碼
  • 以前只有瀏覽器哦可以解析執行Javascript代碼
  • 也就是說現在的Javascript可以完全脫離瀏覽器來運行，一切都歸功於：Node.js

• 瀏覽器中的Javascript

  • ECMAScript

    • 基本語法
    • if
    • var
    • function
    • object
    • array

  • BOM

  • DOM

• Node.js中的javascript

  • 沒有BOM，DOM

  • ECMAScript

  • 在Node這個Javascript執行環境中為javascript提供了一些服務器級別的操作API

    • 例如無監督協
    • 網絡服務的構建
    • 網絡通信
    • http服務器
    • 等處理...

• Node.js uses an event-driven(事件驅動),non-blocking I/O modal（非阻塞IO模型（異步）） that makes it lightweight and efficient（輕量更高效）

• Node.js package ecosystem,npm,is the largest ecosystem of open source libraries in the world.

  • npm 是世界上最大的開源庫生態系統絕大多數的Javascript相關的包都存放在npm上，這樣做的畝的是為了讓開發人員更方便的去下載使用
  • npm install jquery

Node.js能做什么

• web服務器后台

• 命令行工具（不一定基於nodejs開發的）

  • npm（基於nodejs）
  • git（基於c語言）
  • hexo（基於nodejs）
  • ...

• 對於前端開發工程師來講，解除node最多的就是他的命令行工具

  • 自己寫的很少，主要是是用別人第三方的
  • webpack
  • gulp
  • npm

簡單的命令行操作

• d:到d盤
• cd 到當前目錄
• cd.. 返回到上一級
• md(mkdir) 創建文件夾
• rd 刪除文件夾
• dir 列出目錄
• ctrl+c 取消當前命令
• space+↑ 上一個命令 space+↓ 下一個命令

資源

中文社區：https://cnodejs.org/

中文新手入門：https://cnodejs.org/getstart

電子書入門：https://www.nodebeginner.org/index-zh-cn.html

中文文檔：http://nodeclass.com/api/node.html

官網api：https://nodejs.org/dist/latest-v6.x/docs/api/

開發環境准備

1、普通安裝方式

官網：https://nodejs.org/en/；

開發選擇穩定版本

安裝完檢查是否安裝好，查看版本號：node -v(--version)

2、多版本安裝方式

• 卸載已有的nodejs
• nvm常用命令

3、修改npm全局安裝包的目錄

全局安裝包的默認路徑是在c盤user里邊,務必改掉,以防c盤過滿

1. 找到安裝nodejs的地方，新建一個global文件夾，用來放所有用npm安裝的全局的包
2. 打開Node.js Command prompt，執行npm config ls
3. 修改prefix的值：npm config set prefix "你的路徑"

4、卸載nodejs

參考：https://www.cnblogs.com/fighxp/p/7410235.html

node常用

1、使用node執行js腳本文件

1. 創建編寫腳本文件
2. 打開終端，定位到腳本文件所在目錄
3. 輸入node 文件名執行對應的文件
4. 在該js中輸出window和document，發現沒有bom和dom

注意：

不要使用node.js命名文件,這樣會變成打開文件

不要使用中文

IP地址用來定位計算機，

端口號用來定位具體的應用程序

REPL read-eval-print-loop：讀取-執行-打印-循環這個過程

執行node后，功能類似於瀏覽器的console面板。

npm包管理

全球最大的模塊生態系統，里邊所有的模塊都是開源免費的，所有的js的插件，工具等

是nodejs的包管理工具,用來安裝東西

官網：https://www.npmjs.com/

nrm

鏡像

原來包剛一開始是只存在於國外的NPM服務器，但是由於網絡原因，經常訪問不到，這時候，我們可以在國內，創建一個和官網完全一樣的NPM服務器，只不過，數據都是從人家那里拿過來的，除此之外，使用方式完全一樣；

• taobao鏡像
• cnpm鏡像

作用：

• 提供了一些最常用的NPM包鏡像地址
• 快速的切換安裝包時候的服務器地址

常用命令：

• npm install -g nrm：安裝
• nrm ls 查看當前所有可用的鏡像源地址以及當前所使用的鏡像源地址
• nrm use npm或nrm use taobao切換不同的鏡像源地址（並不是安裝,安裝還要install）

 

 

 

 

 

 

 

 

  npm ---- https://registry.npmjs.org/  此國外地址，以下都是copy的國外地址上的放在國內，

* cnpm --- http://r.cnpmjs.org/

  taobao - https://registry.npm.taobao.org/

  nj ----- https://registry.nodejitsu.com/

  rednpm - http://registry.mirror.cqupt.edu.cn/

  npmMirror  https://skimdb.npmjs.com/registry/

  edunpm - http://registry.enpmjs.org/

 

 

注意：

nrm只是提供了幾個常用的下載包地址，並能夠讓我們在這幾個地址之間進行很方便的切換，但是，我們每次裝包的時候，。使用的‘裝包工具，都是npm

例如安裝cnpm：

1. 選擇地址：nrm use cnpm
2. 安裝cnpm：npm install -g cnpm

npm常用的命令

全局安裝 -g

本地安裝

1、安裝包

npm install -g 包名稱（全局安裝）

npm install 包名稱（局部安裝）

2、指定版本安裝時

npm install -g 包名稱@版本號

如果沒有指定版本號，name安裝最新版本

3、卸載包

npm uninstall -g 包名

4、更新包（到最新版本）

npm update -g 包名（此方法不太好用）

示例：

es-checker:檢測node對es6的兼容情況

i5ting_doc:把md文件轉為目錄樹的網頁

生成本地包

本地安裝的包在當前目錄下的node_moudules里面，本地安裝的包一般用於實際的開發

方法一：到文件當前地址，npm init，一步一步填寫生成包

方法二：到文件當前地址，npm init -y一次性生成帶有默認值的包

生成后，當前文件夾下會有一個package.json的文件，這個就是包的配置文件

執行包

方法一：node . 命令：會執行main中指向的文件

方法二：npm run 名（package.json中的scripts對象的屬性名）

示例：安裝art-template

安裝一個前后端通用的框架：art-template

1、在demo文件夾下安裝一個局部的， install art-template@4.8.2(一個舊的版本)

2、回車后該文件夾下回生成一個node_moudules文件（因為art-template依賴該包），在node_moudules文件中可以找到art-template，看該包的package.json文件可以知道其版本號 為4.8.2

3、更新該版本到最新版本：install art-template@latest(update 不太好用)回車，在查看該版本號

添加依賴

生產環境：項目部署上線后的服務器環境

生產環境：平時開發使用的環境環境

--save :向生產環境添加依賴 dependencies

--save-dev：向開發環境添加依賴 DevDependencies

npm install

• 在發布的時候，node—modules是不會發布進去的，因為太大不利於上傳
• 所有該項目需要的依賴都會記錄在package.json中，
• 使用的時候，直接 npm install就可以一次性把package.json里邊的所有依賴都安裝好

yarn

npm的性能不是太好

安裝yarn：npm install -g yarn

	npm	yarn
初始化	npm init	yarn init
安裝包	npm install xxx --save	yarn add xxx
移除包	npm uninstall xxx	yarn remove xxx
更新包	npm update xxx	yarn upgrade
安裝開發以來的包	npm install xxx ---save-dev	yarn add
全局安裝	npm install -g xxx	yarn global add xxx
設置下載鏡像的地址	npm config set registry url	yarn config set registry url
安裝所有依賴	npm install	yarn install
執行包	npm run	yarn run

動手：

1. 安裝less（less轉css）

   1. 、命令行安裝：npm install –g less
   2. Lessc –v 查看版本 是否安裝成功
   3. lessc test.less test.css,編譯成css

2. 安裝typescript（es6轉es5）

 

 

 

xxxxxxxxxx

 

 

 

 

npm -v //檢查你電腦是否安裝了node，是否有npm

npm install -g typescript //全局安裝typescript

tsc -v//檢查tsc（typescript簡寫）的版本號看是否安裝好

 

 

新建ts文件 test.ts

命令行找到ts文件位置，執行下面命令，就會發現js文件自動生成了

 

 

 

xxxxxxxxxx

 

 

 

 

tsc test.ts

 

 

模塊的導入和導出

exports

module.exports