![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
webpack
文章平均质量分 78
webpack等构建工具使用笔记
灵谷
Im just a landlubber in the ocean of IT
展开
-
webpack从入门到精通
开言 webpack作为现代前端开发最火的模块打包工具,已经成为了前端工程师必备的技能之一。 是: 前端资源构建工具; 静态模块打包器; webpack从入口文件开始,根据模块的依赖关系进行分析,然后生成加工后的静态资源; 将高级语法转换成兼容性高的通用语法; 引入chunk块概念–打包–>bundles; 基于nodejs平台的工具,遵循commonjs模块化规范 本章重点讲解: webpack配置参数, 开发环境配置, 生产环境配置, 企业级的优化环境配置 等等 预备技能 基本Nodejs知原创 2021-05-25 18:25:11 · 724 阅读 · 2 评论 -
webpack: 基础配置项
output path [optional] (/dist) 默认值为dist。 将在项目根目录(跟package.json平级的位置)上创建一个dist目录用来存储webpack后的输出。 publicPath [optional] publicPath用来指定应用程序中所有资源的基础路径。 https://webpack.docschina.org/guides/public-path/ ...原创 2021-05-17 16:30:37 · 981 阅读 · 2 评论 -
Webpack和Typescript的别名配置
需求 项目技术栈:webpack + typescript + eslint 代码中多次使用相对路径导入模块,看起来复杂且不美观,如下: import fetch from '../../../../utils/fetch'; 如何将上面的代码进行优化呢? import fetch from 'utils/fetch'; 方案 step1: 配置webpack的resolve.alias module.exports = { entry: { main:'./main.js', },原创 2021-01-07 20:38:10 · 601 阅读 · 0 评论 -
webpack 学习记录
为什么出现webpack? 前端的开发技术多繁杂,不同的规范以及格式,导致前端引擎并不能完全识别这些技术语言。例如:less,typescript等,你都需要手动将其转化为浏览器可识别的语言。当项目庞大时,这样的手动处理就显得尤为复杂。为了实现这一过程的自动化,于是出现了webpack。 什么是webpack? webpack就是模块打包工具,它主要负责:分析项目结构,找到源语言,将原创 2017-12-25 15:16:12 · 149 阅读 · 0 评论