zoukankan      html  css  js  c++  java
  • gulp前端自动化入门

    一、从零开始搭建gulp前端自动化

    1、首先安装nodejs

    2、npm init 初始化 生成package.json

      2.1 可以选装cnpm cnpm是淘宝提供的服务 安装:命令提示符执行npm install cnpm -g --registry=https://registry.npm.taobao.org;  注意:安装完后最好查看其版本号cnpm -v或关闭命令提示符重新打开,安装完直接使用有可能会出现错误;

    2、定位到当前目录 cd..   d:   我在d盘新建了文件夹gulp

    3、npm install --save-dev gulp  安装gulp

    4、新建gulpfile.js  需要安装npm install --save-dev gulp-less  | npm install --save-dev gulp-uglify | npm install --save-dev gulp-autoprefixer

    var gulp = require("gulp"),
    	less = require("gulp-less"),
    	uglify = require("gulp-uglify"),
    	autoprefixer = require("gulp-autoprefixer");
    
    	gulp.task('testLess',function(){
    		gulp.src('src/less/index.less')
    		.pipe(less())
    		.pipe(gulp.dest('src/css'));
    	});
    	//gulp.task('default',['testLess','elseTask']);
    	gulp.task('jsMin',function(){
    		gulp.src(['src/js/*.js'])
    		.pipe(uglify())
    		.pipe(gulp.dest('dist/js'));
    	});
    	gulp.task('testAutoFx',function(){
    		gulp.src(['src/css/my.css'])
    		.pipe(autoprefixer({
    			browsers:['last 2 versions','Android >=4.0'],
    			cascade:true,
    			remove:true
    		}))
    		.pipe(gulp.dest('dist/css'))
    	});
    

    gulp testLess

    参考文章http://www.ydcss.com/

  • 相关阅读:
    Golang Gin 实战(一)| 快速安装入门
    6 款最棒的 Go 语言 Web 框架简介
    Golang教科书般的web框架
    vgo简明教程
    go mod常用命令 已经 常见问题
    线程池原理讲解 Java专题
    Python 3.9安装与使用
    消息队列的基本概念
    实践——GIT安装(2021/05/01)
    vue2.0数据双向绑定原理分析及代码实现
  • 原文地址:https://www.cnblogs.com/junwu/p/5885185.html
Copyright © 2011-2022 走看看