菜单 学习猿地 - LMONKEY

VIP

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练!告别无效练习

接私单赚外块

VIP优先接,累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

入驻
0
0

初识webpack

原创
05/13 14:22
阅读数 147

课程推荐:前端开发工程师--学习猿地精品课程

webpack是基于模块化的打包(构建)工具,通过一个入口文件递归出所有模块的依赖关系,经过一系列的过程(压缩,合并),最终生成运行的代码。

webpack的特点

解决工程化问题(只关注开发时的代码,把工程化过程中的问题交给webpack处理)
简单易用:支持0配置
强大生态:可以融入第三方库
基于nodeJs:webpack构建的过程是运行工在node环境中的,因为需要本地读取文件,分析依赖关系,并且生成打包后的文件,而在浏览器端是做不到读取文件和生成文件的。
基于模块化:webpack打包是根据特殊导入导出语句分析依赖关系进行打包
webpack的安装

通过npm install安装 webpack ,webpack-cli
webpack:核心包,包含webpack构建过程中要用到的所有api
webpack-cli:提供一个简单的cli命令来调用webpack核心包的api,来完成构建过程
安装推荐使用本地安装,使每个项目都使用自己的webpack版本进行构建
npm install -D webpack webpack-cli
webpack使用

webpack默认从src文件夹下的index.js读取入口文件,打包到dist文件夹下的的main.js中
设置开发环境和生成环境

"scripts": {
"dev": "webpack --mode=development",
"build":"webpack --mode=production"
},

初识webpack

标签:初识 pts 默认 文件夹 生成文件 读取 -- 环境 构建

原文地址:https://www.cnblogs.com/jiaobaba/p/13890681.html

发表评论

0/200
0 点赞
0 评论
收藏
为你推荐 换一批