Gulp + Webpack还是Just Webpack？

node.js中 Webpack

樱小胖Mandy

2020-03-20

我看到人们在Webpack中使用gulp。但是后来我看webpack可以代替gulp吗？我在这里完全困惑...有人可以解释吗？

更新

最后，我从吞咽开始。我刚接触现代前端，只是想快速起步并运行。一年多以后，现在我的脚已经湿透了，现在可以开始使用webpack了。对于那些穿着相同鞋子的人，我建议使用相同的路线。并不是说您不能尝试使用webpack，而是先说一下是否看起来很复杂，首先从gulp开始...这没错。

如果您不想要吞咽，是的，虽然有些麻烦，但是您也可以在package.json中指定命令，然后从命令行调用它们，而无需任务运行器即可启动并开始运行。例如：

"scripts": {
      "babel": "babel src -d build",
      "browserify": "browserify build/client/app.js -o dist/client/scripts/app.bundle.js",
      "build": "npm run clean && npm run babel && npm run prepare && npm run browserify",
      "clean": "rm -rf build && rm -rf dist",
      "copy:server": "cp build/server.js dist/server.js",
      "copy:index": "cp src/client/index.html dist/client/index.html",
      "copy": "npm run copy:server && npm run copy:index",
      "prepare": "mkdir -p dist/client/scripts/ && npm run copy",
      "start": "node dist/server"
    },

第2523篇《Gulp + Webpack还是Just Webpack？》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共4个回答
Sam凯小卤蛋 2020.03.20

老实说，我认为最好是同时使用两者。

  • 所有与javascript相关的Webpack。
  • 吞噬所有相关的css。

我仍然必须找到一种用webpack打包css的不错的解决方案，到目前为止，我很高兴将gulp用于css和将webpack用于javascript。

我还npm按照描述将脚本用作@Tetradev。特别是因为我正在使用Visual Studio，并且虽然NPM Task runner很可靠 Webpack Task Runner，但是却很容易出错。

老丝泡芙 2020.03.20

Gulp和Webpack的概念完全不同。您告诉Gulp 如何逐步将前端代码放在一起，但是您通过配置文件告诉Webpack 您想要什么。

这是我写的一篇简短文章（阅读5分钟），解释了我对这些区别的理解：https : //medium.com/@Maokai/compile-the-front-end-from-gulp-to-webpack-c45671ad87fe

在过去的一年中，我们公司从Gulp迁移到Webpack。尽管花费了一些时间，但我们仍想出了如何将在Gulp中所做的所有工作转移到Webpack。因此，对我们来说，我们在Gulp中所做的一切也可以通过Webpack来完成，但反之则不行。

从今天开始，我建议您只使用Webpack，避免将Gulp和Webpack混合使用，这样您和您的团队就无需学习和维护两者，尤其是因为它们需要截然不同的心态。

小卤蛋 2020.03.20

我在不同的项目中都使用了这两个选项。

这里是一个样板，我放在一起用gulp用webpack- https://github.com/iroy2000/react-reflux-boilerplate-with-webpack。

我只有用一些其他的项目webpack有npm tasks。

他们俩都工作得很好。我认为这归结为您的任务有多复杂，以及您希望在配置中拥有多少控制权。

例如，如果你的任务很简单，让我们说dev，build，test...等（这是非常标准的），你是完全罚款只是简单的webpack用npm tasks。

但是，如果您的工作流程非常复杂，并且希望对配置进行更多控制（因为它是编码的），则可以采用gulp路由。

但是从我的经验来看，webpack生态系统提供了我所需的足够多的插件和加载器，因此我喜欢使用最基本的方法，除非您只能在吞吃中做些。而且，如果您的系统中少了一件东西，它将使您的配置更加容易。

如今，很多时候，我看到人们实际上将gulp and browsify所有的人都替换成了一个人webpack。

LGil 2020.03.20

2020年更新

如果您使用ReactJS，请使用create-react-app。我一直在尝试使用webpack和gulp的组合在Electron中配置React App，但是以某种方式失败了。然后，感谢本文解决了我的问题。如果您尝试使用gulp进行sass编译，则也可以使用create-react-app进行此操作，如官方文档中所述

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android