windows10安装gulp cnpm git bower等工具总结

这篇博客总结了在Windows10上安装gulp、cnpm、git、bower等前端工具的步骤,包括解决安装问题的建议。文章强调了使用管理员权限安装、设置淘宝镜像以解决网络问题的重要性。此外,还介绍了如何初始化gulp项目、安装和使用gulp-sass,以及配置livereload实现浏览器自动刷新。最后,博主分享了npm常用命令,提醒注意版本管理和使用正确的命令行工具。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前端工具安装总结 @auther honghong create by 20170413

windows10安装gulp cnpm git bower等工具总是安装不上时,检查一下电脑是否为家庭版,

尽量用管理者权限进行安装以下工具:

1、node:

 去nodejs官网下载安装包进行安装
查询node 版本 node -v
node npm安装 造成无法安装其他工具时,失败可能是网络问题 可能是环境变量问题,可能是电脑为家庭版原因

2、淘宝镜像安装:

npm install -g cnpm --registry=https://registry.npm.taobao.org



3、gulp

npm install gulp -g  全局安装
npm init gulp初始化
gulp如果安装不成功,检查一下npm的版本号是否正确
 
4、bower
npm install bower -g
bower 下载插件 bower install animate.css --save
        npm install animate.css --save


5、git window10 64位需要安装 Git-2.5.3-64-bit 版本
安装git时 环境变量不要选择默认的,选择在Windows命令提示符下使用git,use git from the windows command prompt,这样选择可以省去自己设置环境变量的步骤,同时又不会污染目前的系统环境。


总结:使用gulp工具时,需要初始化package.json文件,在项目根目录打开cmd ,初始化命令:npm init,会自动生成
package.json文件,然后手动新建gulpfile.js配置文件。全局安装gulp是为了执行gulp任务,本地安装gulp则是为了调用gulp插件的功能
进入你的项目文件路径中后,执行

cnpm install gulp --save-dev 调用gulp插件
cnpm install gulp-sass --save-dev
cnpm install gulp gulp-sass gulp-livereload --save-dev  安装插件
gulp sass livereload  运行插件,gulpfile.js中写相应配置代码。



随便写写:

livestyle livereload 游览器自动刷新工具

使用livereload浏览器插件,需要用到gulp http-server

以服务器的方式打开页面,例如http://localhost:8080,而不是file:///F:/phpStudy/project/src/index.html,否则无法启动livereload浏览器插件
http://localhost:8080

npm常用命令:请不要手动的去删除插件和工具,这样package.json还是会有下载记录,要使用命令删除。

安装插件:npm [-g] [--save-dev]

更新插件:npm update [-g] [--save-dev]

卸载插件:npm uninstall [-g] [--save-dev]

指定版本:npm install @VERSION [--save-dev] (其中VERSION就是你所需要的版本号)

连续下载 :$ npm install gulp-less gulp-clean-css gulp-livereload --save-dev

注意事项, 使用 sass监听时,页面打开用gitbash  gulp sass watch 用 cmd
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值