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

相关推荐
程序猿的程18 分钟前
开源一个 React 股票 K 线图组件,传个股票代码就能画图
前端·javascript
不爱说话郭德纲1 小时前
告别漫长的HbuilderX云打包排队!uni-app x 安卓本地打包保姆级教程(附白屏、包体积过大排坑指南)
android·前端·uni-app
唐叔在学习1 小时前
[前端特效] 左滑显示按钮的实现介绍
前端·javascript
用户5282290301801 小时前
【学习笔记】ECMAScript 词法环境全解析
前端
青青家的小灰灰2 小时前
React 架构进阶:自定义 Hooks 的高级设计模式与最佳实践
前端·react.js·前端框架
Angelial2 小时前
Vite 性能瓶颈排查标准流程
前端
不要秃头啊2 小时前
别再谈提效了:AI 时代的开发范式本质变了
前端·后端·程序员
青青家的小灰灰2 小时前
深入理解事件循环:异步编程的基石
前端·javascript·面试
用泥种荷花2 小时前
【LangChain.js学习】 向量数据库(内存/持久化)
前端
Mr_li2 小时前
NestJS 集成 TypeORM 的最优解
node.js·nestjs