gulp安装搭建前端项目自动化
下面是今天在配置gulp运行项目时遇到的问题几个问题及其完整的安装过程:
1、安装node.js 。gulp是基于nodejs使用的 查看版本node -v
2、npm install gulp -g 全局安装gulp(重点)
重点:
3、新建一个项目目录,进入项目目录(cd+项目路径或者找到项目文件shift+鼠标右键->在此处打开命令窗口)
4、创建一个模块 npm init //在项目目录中生成一个package.json
5、本地安装gulp npm install gulp --save-dev(重点) //全局安装gulp是为了执行gulp任务,本地安装gulp则是为了调用gulp插件的功能
6、安装gulp插件
例如:npm install --save-dev gulp-babel babel-preset-es2015 //es6转es5
npm install gulp-autoprefixer --save-dev //css自动添加浏览器前缀(如果报错,就用cnpm重新安装或者重装npm install gulp或者卸载gulp-autoprefixer后再安装)
一般的安装格式:npm install +<插件名>+ --save-dev
7.安装结束后,gulp运行
注释:-save-dev是指将包信息添加到devDependencies,表示你开发时依赖的包裹。 (加载依赖到package.json文件中)
-save是指将包信息添加到dependencies,表示你发布时依赖的包裹。
删除安装的插件:()
1、全局安装 npm i -g rimraf
2、项目目录 rimraf -rf node _modules/插件名(不带插件名时。全部插件都删除,重装插件需删除依赖再重装)
gulp安装搭建前端项目自动化的更多相关文章
- 使用gulp+browser-sync搭建前端项目自动化以及自动刷新
前段时间使用了gulp+browser-sync才发现这个东西真的很好用. 准备工作:(1).安装nodejs.gulp是基于nodejs使用的,所以先安装nodejs,https://nodejs. ...
- 【gulp】gulp + browsersync 构建前端项目自动化工作流
什么是 gulp? gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.gulp.js 是基于 node.js 构建的,利用 node.js 流的威力,你可以快速构 ...
- 手把手教你用SonarQube+Jenkins搭建--前端项目--代码质量管理平台 (Window系统)
前言 网上教程大多介绍的是Linux系统下SonarQube+Jenkins如何使用,这是因为这两款软件一般都是部署在服务器上,而大多数服务器,采用的都是Linux系统.大多数服务器用Linux的原因 ...
- 前端项目自动化构建工具——Webpack入门教程
参考资料:https://www.webpackjs.com/(中文文档) https://www.webpackjs.com/(官方文档) 首先有必要说明一下,本文侧重讲解webpack基本配置 ...
- nodejs解压版安装和配置(带有搭建前端项目脚手架)
nodejs 安装 我先前用了nvm,觉得nvm挺厉害可以随时更换nodejs版本,但是研究了下,可能自己功力不够还是什么,并不好用,中间还出现了错误:所以最后还是卸载了: 本文图文并茂的一步一步的 ...
- 使用vue2.x+webpack+vuex+sass+axios+elementUI等快速搭建前端项目框架
一.本文将分享如何快速搭起基于webpack+vue的前端项目框架,利用vue的自己的脚手架工具vue-cli搭建起基本的环境配置,再通过npm包管理工具引入相应的依赖来完善项目的各种依赖框架.下面是 ...
- 3 分钟轻松搭建 Ruby 项目自动化持续集成
任何事情超过 90 秒就应该自动化,这是程序员的终极打开方式.Automating shapes smarter future. 这是一篇关于 Ruby 项目持续集成的快速指导教程,教大家如何使用 f ...
- 快速搞定用Vue+Webpack搭建前端项目(学习好久了,该写点东西了......)
现在开始安装环境 一.安装node.js 首先要安装node.js,去nodejs官网下载即可,地址:http://nodejs.cn/中文网. 安装完成后,打开终端(windows键+R)搜索cmd ...
- vue-cli安装搭建初始项目
vue-cli脚手架 前提:node + npm 安装好 一.介绍 vue-cli: Vue + ESLint + webpack + iview + ES6 Vue:主要框架ESLint:帮助我们检 ...
随机推荐
- 为什么不要使用 select * from xxx (oracle 亲测)
打开已用时间set timing on;create table users(id number(20), name varchar2(20), password varchar2(20));inse ...
- windows 设置CapsLock键开启大写后使用shift键取消大写
1.打开控制面板——>时钟.语言和区域——>更改键盘或其它输入法——>更改键盘——>高级键设置——>要关闭Caps Lock 2.ok
- Django 开启显示查询语句log
# 下面语句加到setti中 LOGGING = { 'version': 1, 'disable_existing_loggers': False, 'handlers': { 'console': ...
- [翻译] 扩张卷积 (Dilated Convolution)
英文原文: Dilated Convolution 简单来说,扩张卷积只是运用卷积到一个指定间隔的输入.按照这个定义,给定我们的输入是一个2维图片,扩张率 k=1 是通常的卷积,k=2 的意思是每个输 ...
- Spring 集成 Ehcache 开启缓存
1.jar包 1.1.slf4j-api-1.6.1.jar 1.2.ehcache-2.7.0.jar 1.3.spring-core-3.2.0.RELEASE.jar 1.4.spring-co ...
- FileStream对文本进行读写操作
class FileHelper { /// <summary> /// 检验文件路径是否合法 /// </summary> /// <param name=" ...
- 转:oracle:win7手工卸载oracle数据库11g
环境:oracle 11g,win7,64bit 问题:oracle不正常安装.重新安装等情况需要卸载软件,然而oracle11g取消了界面卸载,改为deinstall.bat文件执行卸载.具体关于d ...
- linux 创建新用户并增加管理员权限
1.adduser与useradd有什么区别?2.那种方式会自动创建组.用户组等信息? 3.如何新建用户具有管理员权限? $是普通管员,#是系统管理员,root用户默认是没有密码的,因此也就无法使用( ...
- 笔记本无密码连接wifi
用手机可以用wifi万能钥匙破解wifi,就想找电脑版的wifi万能钥匙,然并卵. 就去寻找各种办法,最后找了个巧, 用手机下载wifi万能钥匙连接,并且使用数据线连接上笔记本. 然后手机设置中找到开 ...
- xdebug安装及使用小结
最近安装了一下xedug,并且学习了一下如何使用.安装xdebug的初衷是为了深入研究一下PHP的垃圾回收机制. Xdebug是一个开放源代码的PHP程序调试器(即一个Debug工具),可以用来跟踪, ...