gitbook教程: https://dragon8github.gitbooks.io/gulp-webpack/content/an-zhuang-gulp-4-0.html gulpfile.js // cnpm i -g gulpjs/gulp#4.0 && cnpm i gulpjs/gulp#4.0 gulp-sass fs-extra gulp-autoprefixer gulp-sourcemaps browser-sync gulp-ejs gulp-rename gul…

http://www.w3ctech.com/topic/134  (该文章有很多错误) http://markpop.github.io/2014/09/17/Gulp%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/ http://segmentfault.com/a/1190000000372547 http://www.cnblogs.com/chyingp/p/gulp-introduction.html      先node init 生成package文件…

异常截图 解决方案: https://stackoverflow.com/questions/36897877/gulp-error-the-following-tasks-did-not-complete-did-you-forget-to-signal-async https://blog.csdn.net/qq_41208114/article/details/79109269 // 必须返回一个steam对象 return gulp.src('package.json'); // 或者返…

gulp的任务的执行是异步的. 所以,当我写完一系列的任务,准备一股脑地执行. # gulp.task('prod', ['clean', 'compass', 'image', 'style', 'html', 'ftp']); [10:22:54] Starting 'clean'... [10:22:54] Starting 'compass'... [10:22:54] Starting 'imagemin'... [10:22:54] Starting 'style'... [10:2…

1.安装nodejs nodejs 官网下载安装文件 安装完成之后,在命令窗口执行,(显示nodejs版本) 和(显示npm版本)可以使用这两个命令查看是否安装成功: node -v npm -v 2.npm 简介 nodejs 安装过程中会自动安装npm,npm  是nodejs的程序包管理工具,用于从网上下载程序包并安装还可以管理工程对程序包的依赖,类似于java平台上的maven. 程序包是指实现了某些功能,并可以运行于nodejs平台,一般是开源程序,如压缩js代码程序,检查js代码正确…

需要node.npm的事先安装!! 1.nodejs安装程序会在环境变量中添加两个变量: 系统环境变量中:path 增加C:\Program Files\nodejs\ 因为在该目下存在node.exe 和npm.cmd,加入path后可以全局调用该命令. 用户变量中设置: path=C:\Users\Administrator\AppData\Roaming\npm 该目录下node_modules目录用来存放安装的全局的nodejs模块,并在npm目录中生成相应的命令行可执行的文件.而将该路…

上一篇的gulp配置很简单,主要就是为了demo的查看和调试,这一篇则会相对详细一些,包括压缩合并打时间戳等. 在互联网环境比较好的城市,需要多人协作的,大一点的项目应该都用上了模块化(这里主要指commonjs和ES6模块系统,不是再早的require.js和sea.js).代码也会更注重如何分离和注入,而不再是单纯的合并. 但是在很多小公司,开发模式或技术都还是比较传统的,或者一些小项目也完全不需要用上那些比较前沿的技术. 所以这篇配置就主要为了这样的中小项目. 1.所需工具和版本 包管理工…

备忘 1.配置 下载安装node.js node -v //检查nodejs版本   npm(nodejs package manager)nodejs包管理工具   nodejs完毕在命令行输入npm -v检验是否安装成功,并检查npm版本   2.安装淘宝cnpm镜像,以下的npm命令可由淘宝的cnpm代替,前提是你已经安装好了cnpm,理论上淘宝镜像安装各种插件速度更快 npm install -g cnpm --registry=https://registry.npm.taobao.o…

https://www.gulpjs.com.cn/docs/getting-started/ ,这个是3.9.0版本 后面发现安装的版本是4.0.0,看下面这个: https://github.com/gulpjs/gulp/blob/master/docs/API.md 参考:https://blog.csdn.net/jianjianjianjiande/article/details/79048778?utm_source=copy 4.0.0更新之处: 新的任务系统(基于 bach,替…

今天不讲webpack,就说说gulp是怎么进行压缩合并打包 首先你的安装gulp : npm install gulp -g --save-dev 然后最基本的你因该知道gulp 的四个方法, gulp.src:读取文件 gulp.pipe:将文件流输入到指定的文件目录 gulp.task:建立gulp任务,例如合并,压缩,清除文件, gulp.watch:用于监听文件的变化 关于其他的嘛,那就是gulp 之所以那么强大,原因就是他有很多插件,我们要完成一些功能就必须要学会使用一些插件 1)在…

最近看了下gulp4.0的升级,感觉和3.0相比变化还是比较大的,很多3.0的写法和插件会出现一些莫名其妙的变化,详细的变化就先不说了,这里我直接把我配置好的代码拿过来吧,方便各位可以更好的学习和使用(下面代码经过本人尝试,可以正确无误的运行) gulp4.0 github源码 1,目录结构 app下面的文件夹就不用多介绍了吧,都是存放的一些基本的静态资源,这里着重说下为啥会多了一个tpl文件夹. 之所以单独列出一个tpl文件夹其实是为了使用gulp-file-include,里面其实存放的是一…

在React和Vue推进下,现在很多人都在使用webpack作为自动化构建工具,但其实在很多时候我们并不是一定需要用到它,gulp这样的轻量级构建工具就足够了. 最近一段时间不是太忙,所以就写了三份配置,用在不同的情况下. 这篇文章介绍第一份配置,也是最简单的一份. 这份配置我把它称作demo测试配置,因为在我工作的时候,经常需要快速出效果或者实现某些功能,你没有时间去自己实现,那么就需要找一些现有的例子或者插件. 不过这些demo或者插件很多时候需要在移动端查看或者启动一个服务器,所以这份配置…

package.json { "name": "gulp", "version": "0.0.1", "description": "Pages for Staging Financial App", "devDependencies": { "browser-sync": "*", "del": "…

1. 找不到local gulp 报错代码: $ gulp [23:29:31] Local gulp not found in [23:29:31] Try running: npm install gulp 解决:npm link gulp 或者重新全局和项目安装gulp 2. cannot find module 'gulp' 报错代码: cannot find module 'gulp'** 虽然项目中已经按照了gulp,但还是在输入gulp时,显示没找到gulp模块. 解决方法是:全局…

Gulp 基于 Node.js 的前端构建工具,可以实现前端代码的编译(sass.less).压缩合并(JS.CSS).测试:图片的压缩:已经添加 JS 和 CSS 版本号,防止浏览器缓存. 1. 安装 全局安装 $ npm install gulp -g 进入项目跟目录,初始化 npm init , 然后安装: $ npm install gulp 安装插件 sass的编译(gulp-ruby-sass) 自动添加css前缀(gulp-autoprefixer) 压缩css(gulp-clea…

一.Gulp的使用 1. 使用npm install  gulp  下载gulp库文件 2. 在项目根目录下简历gulpfile.js文件 3. 重构项目的文件夹架构src目录放置源代码文件,dist目录防止构建后文件. 4. 在gulpfile.js文件中编写任务 5. 在命令行工具中执行gulp任务. 二.Gulp中提供的方法 1. gulp.src(0 获取任务要处理的文件 2. gulp.dest() 输出文件 3. gulp.tast()  简历gulp任务 4. gulp.watch…

在前端工程化中最重要的就是流程管理,借用 gulp 可以很方便的基于流的方式定义流程任务,并将任务串联起来,本节中将详细介绍 gulp ,包括: gulp 介绍 gulp 是什么 gulp 能够解决哪些问题 gulp 核心思想和特点 gulp 安装 gulp 配置和 API 使用 gulp 增量 build 2.3.1 Gulp 介绍 The streaming build system , Automate and enhance your workflow Gulp 是一个基于 Node.j…

在Visual Studio 2017中使用gulp编译sass/scss文件 需要的环境:Visual Studio 2017.Node.js.npm 在vs2017中 [视图]-[其他窗口]-[任务运行程序资源管理器]打开. 在学习的时候,发生网上讲的大多都是的gulpfile.js里面的核心内容,因此我这里写下我的详细操作步骤留作笔记. 步骤: 1.运行:cmd 2.运行:cd 到项目的根目录 3.运行:npm init 初始化package.json (一直Enter到底,也可以按照提示…

Yeoman包括了三个部分yo(脚手架工具).grunt/gulp(构建工具).bower(包管理器).听说gulp更容易上手,所以我就没用grunt而选的gulp 什么是开发流程? 在我看来一个完整的开发流程应该包括: 本地开发环境的初始化 第三方依赖的管理 源文件编译 自动化测试 发布到pipeline和各个环境 而现代的开发流程,就是要使上面的各个部分都可以自动化,一个命令就可以使这些流程都自动走完,并且快速的得到错误或通过的反馈,让我们可以方便快速的修复错误和release. 工具简单介…

项目源码地址 前期准备工作 首先确保本机安装了 node gulp中文文档 安装 gulp 命令行工具 npm install --global gulp-cli 在项目目录下创建 package.json 文件 npm init -y 安装 gulp,作为开发时依赖项 npm install --save-dev gulp 检查 gulp 版本 gulp --version PS D:\a-个人项目管理\使用Gulp搭建项目\gulp-building> gulp --version CLI…

文本内容 使用generator-express创建nodejs MVC DEMO 使用gulp实时编译项目 npm安装二进制包,无须再编译wget https://nodejs.org/dist/v14.17.5/node-v14.17.5-linux-x64.tar.xz解压后加入环境变量export PATH=/opt/app/node-v14.17.5-linux-x64/bin:$PATH npm install -g yarn generator-express An Express…

前言 本文介绍的是AspNetCore的MVC项目,WebApi+独立前端这种前后端分离的项目就不需要多此一举了~默认前端小伙伴是懂得使用前端工具链的. 为啥要用MVC这种服务端渲染技术呢? 简单项目不需要强行分离增加复杂度(如:我正在开发的博客项目) 后端渲染利于SEO,对博客网站友好 OK,虽然MVC的技术老了点,但依然可以结合现代前端工具链来提高效率 本文的食用需要先安装好Node.js环境,下载地址:https://nodejs.org/en/download 在开始前,先看看我们的项目…

前言 之前写了一篇<Asp-Net-Core开发笔记:使用NPM和gulp管理前端静态文件>,现在又来用Django开发项目了,之前我搞了一个Django的快速开发脚手架「DjangoStarter」,正好给升级一下~ 关于npm和gulp我就不多重复了,之前那篇文章都写了,直接上操作 安装依赖 安装依赖的操作跟上一篇文章是一样的,不过我这里直接提供package.json文件,复制到项目根目录里面,然后直接执行命令安装依赖. package.json文件如下: { "name&qu…

前言 NPM大家都熟,天天都在用.最近,NPM不断出现的下载出错 “npm ERR! Error: No compatible version found” ,已经影响到正常的开发工作,到了不得不解决的地步了.网上到处都是这个错误的问题,但解决问题的文章很难找到.我有必要来写一下. 目录 NPM下载出错 No compatible version found 官方解决方案 其他解决方案 1. NPM下载出错 No compatible version found 最近,NPM不断出现的下载出错…

https://github.com/MetaMask/metamask-extension/tree/develop/mascara 找了很多个实例,基本上很少是不使用线上钱包的,只有metamask-extension的mascara实例中实现了,下面是将整个metamask-extension下载下来,进行配置,然后运行的步骤: 进行环境部署: Building locally Install Node.js version 8.11.3 and npm version 6.1.0 If…

前面的一篇文章<微软.谷歌.亚马逊.Facebook等硅谷大厂91个开源软件盘点(附下载地址)>列举了国外8个互联网公司(包括微软.Google.亚马逊.IBM.Facebook.Twitter.eBay.VMware)的开源软件项目,今天我们来盘点一下国内几个体量较大的互联网大厂(腾讯.百度.阿里.美团点评.华为)都有哪些开源软件.快点Mark起来并转发给需要的人吧.   百度开源软件    1.ECharts:JavaScript 图表库  ECharts是一款由百度前端技术部开发的,基于…

参考: https://github.com/Platform-CUF/use-gulp use-gulp 为什么使用gulp? 首先看一篇文章 Gulp的目标是取代Grunt 根据gulp的文档,它努力实现的主要特性是: 易于使用:采用代码优于配置策略,gulp让简单的事情继续简单,复杂的任务变得可管理. 高效:通过利用node.js强大的流,不需要往磁盘写中间文件,可以更快地完成构建. 高质量:gulp严格的插件指导方针,确保插件简单并且按你期望的方式工作. 易于学习:通过把API降到最少,…

三.项目环境搭建 3.1.创建项目环境和安装包 创建django项目 mkvirtualenv DjangoProject workon DjangoProject pip install -i https://pypi.douban.com/simple django==2.0.2 进front目录 npm init #初始化一个package.json配置文件文件 在package.json文件中添加要安装的包 "devDependencies": { "browser-…

一.NPM的扩展使用 (1)  npm init:初始化一个Node.js项目------创建必须的package.json文件 npm init -y:创建必须的package.json文件 (2) npm help json:查看package.json文件中可用的所有条目 (3) npm install xxx:下载安装指定的扩展依赖模块 npm install  xxx  --save:下载并安装指定的依赖模块,并声明为"运行时依赖" npm install xxx ---sa…

一.前言 在项目的前端开发中,对于绝大多数的小伙伴来说,当然,也包括我,不可避免的需要在项目中使用到一些第三方的组件包.这时,团队中的小伙伴是选择直接去组件的官网上下载,还是图省事直接在网上搜索,然后从一些来源不明的地方下载,我们就无法管控了.同时,我们添加的组件间可能存在各种依赖关系,如果我们没有正确下载引用的话,到最后可能还是无法正常使用. 因此,如何从可信的源下载组件包,以及如何轻松的解决各个组件间的依赖关系就成了我们需要解决的问题,那么,有没有一种工具可以帮我们解决这一问题?你好,有的,…