React 相关开发工具

Posted 2020-08-14 筱qian

Gulp:是一个NodeJs项目构建工具，高效易学；把一个开发中的项目构建成一个可以部署在服务器上的项目，压缩 整合 

gulp.task(‘1‘,[‘2‘,‘3‘],function(){});// 执行完1，执行2和3

　　

1 gulp.task(‘sass‘,function(){
2       gulp.src(‘./sass/**/*.scss‘)   //读入文件内容
3       .pipe(sass().on(‘error‘,sass.logError))    //转换成css
4       .pipe(gulp.dest(‘./css‘));   //写入目标目录
5 });

 

Browserify：浏览器中js依赖管理工具。  是一个浏览器端代码模块化的工具；

服务器端NodeJs自带模块化功能，可以使用require和module.exports构建项目。

原理：部署时处理代码依赖，将模块打包到一起

Webpack：代码的打包，代码的预处理，专注js代码的优化。是加强版的Browserify，适应大型单页应用。

两大特色：code splitting 和 loader

code splitting 可以自动完成，不需要手动处理，

loader 可以处理各种类型的静态文件，并且支持串联操作。