webpack

1、常见的构建工具

1)webpack

2)grunt

3)gulp

4)browserify

5)fis

6)其他

2、webpack

定义:是基于模块化的打包(构建)工具,它把一切视为模块,通过一个开发时态的入口模块为起点,分析出所有的依赖关系,然后经过一系列的过程(压缩,合并),最终生成运行时态的文件;

特点:

1)为前端工程而生(工程化过程交给webpack,开发者专注于业务的开发)

2)简单易用(安装之后,可以不用写一行代码)

3)强大的生态(提供了可以扩展功能的机制,使得第三方库可以融入)

4)基于node.js(webpack构建过程中需要读取文件,因此它是运行在node环境中的)

5)基于模块化(支持各种模块化标准,包括但不限于CommonJs和ES6 Module)

安装:

webpack:核心包,包含了webpack构建过程中用到的所有api

webpack-cli:调用webpack核心包来完成构建过程

方式:全局安装和本地安装(每个项目使用自己的版本)npm i -D webpack webpack-cli

问题:WARNING in configuration,需要指定打包的环境,生产还是开发环境

npx webpack --mode=development

相关推荐
❀͜͡傀儡师14 分钟前
Aube:下一代 Node.js 包管理器,性能远超 pnpm
node.js·aube
一点一木7 小时前
深度体验TRAE SOLO移动端7天:作为独立开发者,我把工作流揣进了兜里
前端·人工智能·trae
天外飞雨道沧桑7 小时前
TypeScript 中 omit 和 record 用法
前端·javascript·typescript
Lee川8 小时前
mini-cursor 揭秘:从 Tool 定义到 Agent 循环的完整实现
前端·人工智能·后端
canonical_entropy9 小时前
从 Spec-Driven Development 到 Attractor-Guided Engineering
前端·aigc·ai编程
研☆香9 小时前
聊聊前端页面的三种长度单位
前端
给钱,谢谢!9 小时前
React + PixiJS 实现果园成长页:从状态机到浇水动画
前端·react.js·前端框架
暗冰ཏོ10 小时前
VUE面试题大全
前端·javascript·vue.js·面试
次元工程师!10 小时前
LangFlow开发(三)—Bundles组件架构设计(3W+字详细讲解)
java·前端·python·低代码·langflow
Bug-制造者11 小时前
现代Web应用全栈开发:从架构设计到部署落地实战
前端