npm
- 官网[https://www.npmjs.com]
- node package manager
- 命令:
- 初始化:
npm init
- 安装指定包:
npm install jquery --save
- 删除指定包:
npm remove jquery --save
- 下载安装package.json中dependencies属性对的文件:
npm install --production
- 初始化:
-
- 说明:npm(node package manager)是nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等)
- 使用npm安装插件:命令提示符执行
npm install <name> [-g] [--save-dev]
<name>
:node插件名称。
例:npm install gulp-less --save-dev
-g
:全局安装。
将会安装在C:\Users\Administrator\AppData\Roaming\npm,并且写入系统环境变量; 非全局安装:将会安装在当前定位目录; 全局安装可以通过命令行在任何地方调用它,本地安装将安装在定位目录的node_modules文件夹下,通过require()调用;--save
:将保存配置信息至package.json(package.json是nodejs项目配置文件);-dev
:保存至package.json的devDependencies节点,不指定-dev将保存至dependencies节点;为什么要保存至package.json?因为node插件包相对来说非常庞大,所以不加入版本管理,将配置信息写入package.json并将其加入版本管理,其他开发者对应下载即可(命令提示符执行npm install,则会根据package.json下载所有需要的包)。
3.使用npm卸载插件:
npm uninstall <name> [-g] [--save-dev]
PS:不要直接删除本地插件包
4.使用npm更新插件:npm update <name> [-g] [--save-dev]
5.更新全部插件:npm update [--save-dev]
6.查看npm帮助:npm help
7.查看当前目录已安装插件:npm list
PS:npm安装插件过程:从http://registry.npmjs.org下载对应的插件包(该网站服务器位于国外,所以经常下载缓慢或出现异常),解决办法往下看↓↓↓↓↓↓。
cnpm
- 说明:因为npm安装插件是从国外服务器下载,受网络影响大,可能出现异常,如果npm的服务器在中国就好了,所以我们乐于分享的淘宝团队干了这事。来自官网:“这是一个完整 npmjs.org 镜像,你可以用此代替官方版本(只读),同步频率目前为 10分钟 一次以保证尽量与官方服务同步。”
- 官方网址:http://npm.taobao.org
- 安装:命令提示符执行
npm install cnpm -g --registry=https://registry.npm.taobao.org
- 注意:安装完后最好查看其版本号cnpm -v或关闭命令提示符重新打开,安装完直接使用有可能会出现错误
注:cnpm跟npm用法完全一致,只是在执行命令时将npm改为cnpm。
browser-sync
- 更改代码之后自动刷新浏览器
- 需要使用npm进行全局安装:
npm install browser-sync -g
,-g表示安装到全局 - 使用:
browser-sync start --server --files "./index.html,app.css,./css/*.css,*.*"
- --files参数指定要监视的文件,后面跟要监视的文件的文件路径以逗号分隔。
gulp
-
前端自动化构建工具 js压缩,var x,xname,混淆 合并. css压缩 html压压缩
-
grunt ,webpack...
核心就5个方法
- task,gulp中是一个个任务的形式来实现功能。
- task('任务名',function(){ ..... });
- src
- src('./*.js')
- dest('./minjs/')// 指定处理后的文件的输出路径.
- watch('./*.js',['任务名1','任务名2']);
- run('任务名');//执行指定的任务.
gulp的安装
- 使用npm 进行安装
npm install gulp-cli -g
;
gulp 使用
使用时还需要在项目中通过npm非全局安装gulp
npm install gulp --save-dev
还需要在当前项目根目录添加一个gulpfile.js文件来写具体的任务代码.
gulp的一些插件
- 也是使用npm安装
- 对js代码进行压缩 gulp-uglify
- 对代码进行合并 gulp-concat
- 对css进行压缩 gulp-cssnano
- 对html进行压缩 gulp-htmlmin