NPM使用介绍

NPM是随NodeJs一起安装的包管理工具,能解决NodeJs代码部署上的很多问题,常见的使用场景有以下几种


NPM使用介绍_第1张图片
作用

在上篇笔记当中,我已经安装好node.js,所以电脑上集成了npm,输入dos命令npm-v出现版本提示信息代表安装成功。

如npm的其中一个作用而言,“允许用户从NPM”服务器下载别人编写的第三包到本地使用,比如我自己常用bootstarp,以前都是自己下载到本地或者引用CDN地址

在我查阅的一些教程和视频当中,有个不得不提的小技巧:

如果在cmd中直接使用npm来安装一些工具会比较慢,所以我们使用淘宝镜像

具体的方法是输入npm install -g cnpm –registry=https://registry.npm.taobao.org,即可安装npm镜像,以后再用到npm的地方直接用cnpm来代替就好了


NPM使用介绍_第2张图片
淘宝镜像首页

安装完npm镜像之后,开始全局安装vue-cli脚手架(这个名词有点专业),我现在只知道他的作用,是应为这个工具能帮我们搭建好我们需要的模板框架

1、cnpm install -g vue-cli回车,在命令行输入vue,出来vue的信息代表安装成功

2、安装脚手架以后开始创建一个新项目,命令 vue init webpack vue_project(vue_project)是自己创建的项目文件夹的名字


NPM使用介绍_第3张图片


NPM使用介绍_第4张图片
vue_project项目文件创建完成

这是使用脚手架搭建的项目文件的结构

3、因为各个模板都是相互依赖的,所以要安装依赖,输入npm install ,你会发现在已经创建的项目结构里面会多出一个node_modules的文件,之前我输入过了,所以在上面的截图当中,会发现有个node_modules的文件

4、测试下项目里面的app.vue模块能否跑起来,需要安装一下服务器环境,输入 cnpm run dev回车

NPM使用介绍_第5张图片


NPM使用介绍_第6张图片
测试成功

如果全局安装过vue-cli,在搭建项目无需再安装了,直接是vue init webpack 項目名即可。

——————————————————————————————————

使用package.json位于模块的目录下,用于定义包的属性


NPM使用介绍_第7张图片

1)卸载模块   npm uninstall 模块名比如説npm uninstall 

(npm install express 会在c:\AA\Users\node_modules看到express插件,使用卸载模块命令之后就没了)

2)查看 npm ls

3)package.json文件是必不可少的,我们可以使用NPM生成package.json文件,生成的文件包含了基本的结果


NPM使用介绍_第8张图片


NPM使用介绍_第9张图片
找到生成的package.json文件



NPM使用介绍_第10张图片

找到之后可以直接用编译器打开packjson的内容,然后可以直接开始项目了

NPM常用的命令

NPM使用介绍_第11张图片

总结   1、 安装/删除模块 npm/cnpm install/uninstall  名字     如 cnpm install vue

       2、

NPM使用介绍_第12张图片

3、构建模块

NPM使用介绍_第13张图片
4、Npm其他命令

如npm install和npm publish,npm update...

你可能感兴趣的:(NPM使用介绍)