express+gulp构建项目(三)gulp任务】的更多相关文章

这次来看一看gulp是怎么工作的. tasks/paths.js paths.js文件里存放的是gulp任务中需要导入的文件的路径和导出的路径. /** * gulp.src 地址 * gulp.dest 地址 */ var commonSrc = './public/**/*'; var widgetSrc = '!./public/widget/**/*.*'; var bowerSrc = '!./public/bower_components/**/*.*'; var fileOutpu…
这一次整理的内容是项目主文件和如何启动项目. 启动项目 通过nodejs官网的例子https://nodejs.org/docs/latest-v4.x/doc/api/synopsis.html我们可以知道,在项目目录下打开终端命令行,并且输入如下命令即可启动服务: node app.js 其中app.js是项目的主文件. 那是因为这个主文件里面有创建服务和监听端口的语句: const http = require('http'); const hostname = '127.0.0.1';…
gulp.js作为一个前端构建工具,类似于webpack.Grountjs.rollupjs,不过相对于其他几种打包工具,gulp的使用更轻量,配置更简单,打包速度更快,今天不说他们几个的区别,也不说它的实现原理,直接说gulp如何使用. 使用背景 安装gulp gulp的几个常用api 配置常用插件 1.使用背景 最近公司官网迭代升级,数据交互基本没有,都是一些展示类的页面,页面也不是特别多,所以考虑直接写静态页面放到服务端:产品要求适配各不同pc端屏幕的大小,设计给稿尺寸标准为1920,考虑…
express是基于nodejs平台的web框架,它可以让我们快速开发出web引用.而gulp是一种自动构建工具,非常强大,有了它,能帮我们完成很多繁琐的工作,例如,静态文件的压缩,为静态文件加上哈希值的命名以防止缓存等等. 环境安装 若要使用express框架和gulp,首先要安装nodejs环境,因为安装了nodejs环境,才能使用npm包管理器来下载express和gulp. nodejs到官方网站下载即可,现在一般项目中使用4.6的稳定版本. 项目大体结构 从这个图中我们可以很清楚的看出…
这里的文件负责配置swig模板引擎. index.js var jsonHash = require('./json_file'); var staticTag = require("./tag-static"); exports.init = function (swig) { swig.setExtension('static', function (input) { //swig.setExtension为自定义标签添加扩展.'static'为自定义标签的名字 //input是通…
这里的文件的作用是负责设置env环境变量和日志. index.js try { require('dotenv').load({silent: true}); //dotenv从一个.env文件中读取环境变量到process.env中 //process.env会返回一个所有环境变量的对象 } catch (error) { console.log('没有.env文件,将会从 process.env 中读取'); } var extend = require('util')._extend; /…
1,cnpm i express -g 2,  cnpm i express-generater -g 3, express - e  项目名…
项目源码地址 前期准备工作 首先确保本机安装了 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…
前言 前端技术发展日新月异,随着模块化.组件化的提出,前端变得越来越复杂,静态资源越来越多,那么对静态资源的处理,如压缩,合并,去掉调试信息.. 如果还是人工去处理,效率非常之低且还容易出错,于是自动化的处理工具也就必然出现了.就像后端我们一般用maven管理项目,那么前端gulp是个不错的选择. 什么是gulp 是一个基于 Node.js 流.Javascript语法的快速构建前端项目并减少频繁的 IO 操作的自动化工具. Gulp有什么好处 易于学习使用 通过最少的API(核心.src().…
gulp进阶构建项目由浅入深 阅读目录 gulp基本安装和使用 gulp API介绍 Gulp.src(globs[,options]) gulp.dest(path[,options]) gulp.task(name[,deps],fn); gulp.watch(glob[,opts],tasks) gulp一些常用插件 gulp-rename(重命名) gulp-uglify(JS压缩) gulp-minify-css(css文件压缩) gulp-minify-html(html压缩) gu…