前言☀️对于刚毕业踏入社会的小白前端,在习惯了​​Vue​​​脚手架完成业务功能后自带的​​webpack​​​打包后对于打包的印象基本上就只有一个:​​npm run build​​但是往往我们看招聘信息上面都有这么一行有使用GulpWebpack等项目自动工程化经验者优先这时候我们就去找两者的区别,听网上简单的描述就是这两❓干的事情都一样呀不都是优化性能吗❓说到自动化,也就是我们经常说的前端
原创 2022-04-19 11:57:59
434阅读
1、Grunt处理Sass转换成CSS过程 2、Gulp处理Sass转换成CSS过程 3、Webpack执行原理 4、区别 (1)gruntgulp都类似于webapck的中的scripts,属于任务处理。 (2)gulp优于grunt的是 流式处理文件,将中间文件放到内存中;而不是通过创建文件(
转载 2019-01-17 19:03:00
170阅读
2评论
一、gulp是工具链、构建工具,可以配合各种插件做js压缩,css压缩,less编译 替代
原创 2021-12-28 14:29:13
98阅读
在现在的前端开发中,前后端分离、模块化开发、版本控制、文件合并与压缩、mock数app通常是一个单页面应用(S...
原创 2022-09-29 16:11:23
85阅读
读取JavaScript源文件因为是对源代码进行处理,因此需要读取源文件。当然代码也可以直接放进处理文件中,但是有些代码非常多,不太适合,因此这里使用读取文件的方式来获取源代码代码如下let encode_file = "./encode.js",decode_file = "./decode_result.js"; if (process.argv.length > 2) { e
转载 2023-11-28 01:58:19
209阅读
gulp webpack 定位 基于任务流的自动化打包工具 模块化打包工具 优点 易于学习理解, 适合多页面应用开发 可以模块化的打包任何资源,适配任何模块系统,适合SPA单页应用的开发 缺点 不太适合单页或者自定义模块的开发 学习成本低,配置复杂,通过babel编译后的js代码打包后体积过大 ...
转载 2021-06-30 14:10:07
1328阅读
引用知乎的回答:https://www.zhihu.com/question/37020798 怎么解释呢?因为 Gulp browserify / webpack 不是一回事 Gulp应该Grunt比较,他们的区别我就不说了,说说用处吧。Gulp / Grunt 是一种工具,能够优化前端工作
转载 2016-12-24 03:59:00
135阅读
2评论
gulpwebpack定位基于任务流的自动化打包工具模块化打包工具优点易于学习理解, 适合多页面应用开发可以模块化的打包任何资源,适配任何模块系统,适合SPA单页应用的开发缺点不太适合单页或者自定义模块的开发学习成本低,配置复杂,通过babel编译后的js代码打包后体积过大
转载 2022-03-29 11:55:10
347阅读
GulpWebpack的基本区别:gulp可以进行js,html,css,img的压缩打包,是自动化构建工具,可以将多个js文件或是css压缩成一个文件,并且可以压缩为一行,以此来减少文件体积,加快请求速度减少请求次数;并且gulp有task定义处理事务,从而构建整体流程,它是基于流的自动化构建工具。Webpack是前端构建工具,实现了模块化开发和文件处理。他的思想就是“万物皆为模块”...
webpackwebpack34的区别:4是零配置的;$npm i webpack -D$npm i webpack -cli -D就可以在命令行使用webpack命令;入口文件可以写成字符串,数组或者对象。写成数组就打包到一起,写成对象会分片打包。webpack-plugin:html-webpack-pluginwebpack-dev-serverwebpack-me...
原创 2021-06-19 16:57:36
1246阅读
webpackwebpack34的区别:4是零配置的;$npm i webpack -D$npm i webpack -cli -D就可以在命令行使用webpack命令;入口文件可以写成字符串,数组或者对象。写成数组就打包到一起,写成对象会分片打包。webpack-plugin:-webpack-pluginwebpack-dev-serverwebpack-me...
笔记: 1、 2、所有的gulp任务都带一个回调函数。这个回调函数的调用,说明该任务结束了。 3、gulp如何传参? 使用示例:gulp build --env prod webpack默认只能加载(import)js文件加载器(loader)的作用就是把其它类型的文件转换成Js代码文件引入到程序中
转载 2016-07-28 10:49:00
96阅读
2评论
一、gulp 1 var gulp = require('gulp'); 2 var react = require('gulp-react'); 3 4 gulp.task('jsx', function() { 5 gulp.src('./app.jsx') 6 .pi...
转载 2015-12-23 21:48:00
146阅读
2评论
webpack简介Webpack 是一个模块打包器。它将根据模块的依赖关系进行静态分析,然后
原创 2022-09-07 10:39:18
287阅读
Gulp / Grunt 是构建工具,可以配合各种平台上的插件做js压缩,各种css编译,页面自动刷新,检查语法等,替代手工实现自动化开发seajs/requirebrowserify/webpack 这4个都是js模块化的方案seajs / require:是一种在线"编译" 模块的方案,相当于在页面上加载一个 CMD/AMD 解释器。这样浏览器就认识了 define、exports、...
原创 2021-07-09 17:07:08
153阅读
Gulp / Grunt 是构建工具,可以配合各种平台上的插件做js压缩,各种css编译,
原创 2022-02-04 12:18:16
145阅读
gulpfile.js:var gulp = require('gulp'),    minifycss = require('gulp-minify-css'),    uglify = require('gulp-uglify');var assetRev = require('gulp-asset-rev'); gulp.task('rev'
原创 2016-07-23 17:01:14
759阅读
gulp是工具链、构建工具,可以配合各种插件做js压缩,css压缩,less编译 替代手工实现自动化工作1.构建工具2.自动化3.提高效率用webpack是文件打包工具,可以把项目的各种js、css文件等打包合并成一个或多个文件,主要用于模块化方案,预编译模块的方案1.打包工具2.模块化识别3.编译模块代码方案用所以定义用法上来说 都不是一种东西,无可...
转载 2021-06-30 11:27:59
210阅读
三者都是前端构建工具,gruntgulp在早期比较流行,现在webpack相对来说比较主流,不过一些轻量化的任务还是会用gulp来处理,比如单独打包CSS文件等。gruntgulp是基于任务流(Task、Stream)的。类似jQuery,找到一个(或一类)文件,对其做一系列链式操作,更新流上的数据, 整条链式操作构成了一个任务,多个任务就构成了整个web的构建流程。webpack是基于入口
转载 2022-03-29 10:44:54
181阅读
本文样例代码 :https://github.com/demohi/learning-gulp 本文主要简单介绍一下基于gulpwebpack的前端工程化。 技术栈 React.js reFlux Node.js 我们的需求 基于CommonJS模块化开发 基于React.js的组件化开发(JSX
转载 2016-10-20 00:37:00
86阅读
2评论
  • 1
  • 2
  • 3
  • 4
  • 5