不花钱的模块超市npm

npm网站收集了前端的各种工具.： jQuery,  bootStrap,  flexible.js,  echarts.js........

你是如何下载的？官网下载?

有没有一个想法：在一个地方下载所有的库(模块.....)

给大家介绍一个很好用的"模块超市"npm

https://www.npmjs.com/

接下来,给大家详细介绍一下npm,以及使用步骤

去npm网站下载我们的需要的代码时，它们是以"包"这种结构放在npm网站上的。我们需要了解下包和模块的关系。下面用一张图帮助大家理解:

 

• nodejs中一个模块就是一个单独的js文件
• Node.js 中的第三方模块，又叫做包、第三方包、依赖包
• 包是多个模块的集合。一个模块的功能比较单一，所以一个包一般会包含多个模块。
• npm 管理的单位是包。类似于网站和网页的区别：一个网站一般会包含多个网页。

所以应该如何去使用npm下载使用包呢?

第一步：初始化项目

这里提到的项目并不是某个具体的功能，只是要创建一个空文件夹即可（注意，不要起中文名字哈）。

进入到项目所在的根目录下，启动小黑窗    

输入以下命令:

npm init --yes
(--与yes之间没有空格， -- 与init之间有空格  或者是 npm init -y)

nit命令用来在根目录下生成一个package.json文件，这个文件中记录了我们当前项目的基本信息，它是一切工作的开始。如图:

 第二步：安装包

npm 这个超市中有现成的写好的代码，我们想下载来用，这个过程就是安装包，或者叫下包、装包

安装命令: npm i 包名

据我们遇到的实际问题，我们来引入相应的包来解决它们。

第三步：使用包

当我们已经下载好一个包之后，就可以像使用核心模块一样去使用它。

格式是：const 常量名 = require('包名') 这个格式与引入核心模块的格式是一样的

例如:

// 从npm下载 别人写的好代码，在本地引入，并使用
const dayjs = require('dayjs')

console.log( dayjs()
.startOf('month')
.add(1, 'day')
.set('year', 2018)
.format('YYYY-MM-DD HH:mm:ss') );

console.log(dayjs);

就可以使用喽~~~

用dayjs为大家举例子:以上代码的整体目录结构

project01
├── node_modules        #  统一放置下载的包
│   └── dayjs                #  某个包
├── xx.js                        #  业务代码， 引入dayjs来使用
├── package.json           #  记录本项目的信息
└── package-lock.json   #  下载包的详细信息

最后大家可以自己去尝试一下npm这个免费的模块超市!