npm gulp等相关配置

  1. 初始化npm的配置文件。

请提前安装好node。

# 到项目的根目录下执行如下命令
$ npm init -y

命令执行完后,会在 项目根目录下生产package.json文件,此文件为npm的配置文件。

  1. 安装我们依赖的gulp插件
# 先全局安装gulp
$ npm i -g gulp
# 安装gulp依赖
$ npm i -D gulp
  1. 安装gulp-sass依赖
# 安装gulp-sass
$ npm i gulp-sass -D

# 安装gulp-sass  ,依赖了node-sass,此包比较大,从github网站下载。可能会失败
# 怎么解决?http://lzw.me/a/node-sass-install-helper.html
  1. 全局安装live-server帮我们启动web服务
# 全局安装live-server
$ npm i -g live-server
# 进入我们的项目录
# 启动web服务。
$ live-server
  1. chrome浏览器远程真机调试
    首先保障以下几点:
  • 手机必须打开usb调试功能(android)
  • 手机必须安装android的chrome浏览器app
  • 手机要通过usb链接到电脑。

用chrome可以进行远程链接调试。

第一步:打开开发人员工具
第二步:点击菜单栏的更多工具按钮
第三步:选择远程device功能。
第三步:选择我们的手机设备,然后进行点inspect按钮

  1. 安装gulp的相关自动化流程工具
# css文件压缩
$ npm i gulp-minify-css -D

# js文件压缩
$ npm i gulp-uglify -D

# image文件压缩
$ npm i gulp-imagemin -D

# gulp-concat实现文件合并
$ npm i -D gulp-concat

# gulp-rename 重命名
$ npm i gulp-rename -D

# 安装文件夹清理
$ npm i gulp-clean -D

# 更改版本号
$ npm i gulp-rev-collector -D

# 安装sourcemap
$ npm i gulp-sourcemaps -D

# html压缩
$ npm install -D gulp-minify-html 

# js压缩
$ npm install -D gulp-uglify

转载于:https://www.cnblogs.com/ccvtt/p/8512650.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值