Nodejs 前端打包现在都用什么工具？求推荐
Nodejs 前端打包现在都用什么工具？求推荐
我是后端，小公司接手了个 node 项目，需要做一个前端的 demo ，里面有个 node 的依赖，感觉以前的<script>引入 js 都不能用了，看了一圈，现在前端都得打包了，什么 webpack ，vite ，gulp ，不知道大家推荐用哪一个打包工具？
这个描述没看懂，项目的运行环境到底是浏览器还是 node 。
如果是浏览器，完全可以不考虑那些，用你熟悉的方式搞就可以；
如果是 node ，简单来说都不需要打包，反正是服务端运行
那我问一下
- 浏览器不支持 call?.() 这种语法糖怎么办?
- React 用 createElement 一直写下去确定不嫌弃麻烦吗?
- 是不是每个浏览器的兼容性问题都要自己去写 polyfill ?
- 代码的 tree shaking 怎么实现？
- 代码的 code splitting 怎么实现?
- 代码的库的递归依赖怎么解决？ 例如 Antd 依赖 React ， 你的项目也依赖 React 这种依赖怎么解决，直接引入吗？
请给我一个解决方案， 别告诉这些都不用做，前端只负责写一个 HTML 页面就好了，不需要 css/js 库, 也不需要解决依赖管理的问题？
你了解一下 google web toolkit 就知道，如果 web 开发要发展, 把 js 当作汇编语言进行语法解析树分析是必然的过程， 如果你觉得这是为了提高所谓的门槛，我只能说这种门槛也太低了
内卷的人是我讨厌的，你这样的也是我讨厌的，上来就苦大仇深的，跟我欠你几百万不还一样，还趾高气昂的，我看着就讨厌，你有看题主写的什么东西，题主问打包工具这么多，选哪一个，给你点赞的估计也是玻璃心，不会回你这样的了
打包工具不是必需的，如果只是做个 demo ，很可能不需要打包。
用了打包工具，最终还是需要在 html 里插 script 标签引入 JS 。
非要用的话就看自己用的框架有没有自带打包工具的脚手架，直接用自带的就行，没必要浪费时间亲自去配置。
小项目用 vite ，编译快，编译出来的是 esm 代码。
大项目用 webpack ，插件多，编译的代码兼容性强（指的是 webpack 自身的代码）。
组件用 rollup ，编译出来的代码少，支持各种模块化方案。
gulp 是自动化构建工具，支持多任务并行或者串行执行，相当于流水线的工作方式。
主要是依赖的开源库需要用 import 引入，还带了一堆的依赖，然后我就抓虾了，看了一下 mdn ，浏览器自带的 import 应该没有解决怎么递归依赖，估计还是得用打包工具，我看了一下项目 demo 是用 gulp 的。
ps：楼上的各位也不用争论，我理解每个领域都是在发展的，我以前还会用 jquery 写一些比较简单的前端功能，现在估计得从头学才能掌握，只能说前端也越来越工程化了，以前前端讲究的是切图，理解 dom 结构，掌握浏览器渲染的规则，现在可能更偏向于脚手架了。
#26 现代浏览器应该是支持 script 标签的 type=module ，递归依赖也是支持的，浏览器在遇到 import 指令的时候会去按照路径请求对应的 js 文件，你可以试试。
具体可以参考这个 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Modules
当然，如果依赖是用 require 来引用的话，就必须用打包工具合并或转换一下了。
我看了一下，开源库是用 ts 写的，然后引入用的是 import ，引入的时候没有后缀，直接是文件名：
import { EnhancedEventEmitter } from ‘./EnhancedEventEmitter’;
这种是不是也只能够用打包工具了？
在Node.js前端打包领域，常用的工具主要有以下几种：
-
webpack：
- 功能：一个模块打包器，可以将多个文件打包成单个文件，便于部署和管理。
- 使用示例：
npx webpack（运行webpack构建），npx webpack --watch（监视文件更改并自动重建）。
-
ncc：
- 功能：由Vercel提供，可将Node.js应用打包为一个单一文件，无需使用npm包安装及分发多个文件。
- 使用场景：适合serverless及需要单一文件入口运行的项目。
- 使用示例：
ncc build lib/index.js -o dist（将lib/index.js打包到dist目录）。
-
pkg：
- 功能：可将Node.js应用打包为二进制文件，直接运行而不依赖外部Node.js环境。
- 使用场景：适用于需要分发独立可执行文件的项目。
-
npm/yarn/pnpm：
- 功能：作为包管理工具，不仅用于安装和管理依赖，还通过
npm run或yarn命令来执行打包脚本。 - 示例（使用npm）：
npm install（安装依赖），npm run build（执行打包脚本）。
- 功能：作为包管理工具，不仅用于安装和管理依赖，还通过
这些工具各有特点，具体选择取决于项目需求、团队习惯及性能要求。对于大多数Node.js前端项目，webpack因其强大的功能和灵活性而广受欢迎。
