webpack
杏子姐_1024
1、科大讯飞前端负责人,书籍《Web全栈项目开发入门与实战》作者。
2、职业规划师,可解决:①职业定位问题(帮你找到更适合你的工作);②提升职场竞争力(帮你升职加薪);③职业转型问题(如果你不喜欢当前的工作,辅助你快速转型);④提升职业幸福度(帮你平衡家庭和工作,消除职业倦怠期)。可修改简历和辅导面试。
3、【梦想岛】社群创办人,该社群带领大家一步步实现自己的人生目标,自律打卡,每天进步。人生可以慢,梦想不缺席。
展开
-
前端配置跨域代理
跨域对于前后端开发来说是一个老生常谈的问题了。客户端与服务端通信时协议不同、域名不同、端口不同都会产生跨域问题。原创 2020-11-24 16:30:00 · 26931 阅读 · 1 评论 -
使用 customize-cra 修改 webpack 配置
说到 webpack 配置,很多人都知道在项目根目录下创建 webpck.config.js 文件,然后在该文件中配置参数即可。但是如果使用脚手架命令,如 `create-react-app myproject ` 创建的项目,是不需要手动配置 webpack 的。但是因项目需要单独配置或者覆盖原始 webpack 配置,该如何做昵?原创 2020-11-24 11:46:35 · 14847 阅读 · 3 评论 -
1分钟了解 Tree-shaking
Tree-shaking 中文译为摇晃之后的树,用在 webpack 打包中。其功能是移除 JavaScript 上下文中未引用的代码。比如在项目中引用了一个模块 antd 。但其实只使用到了 Button 组件、Input 组件、Form 组件等。那么 webpack 在打包后会消除掉以上组件之外的其他 antd 组件。从而减小打包体积,以此达到性能优化的目的。原创 2020-11-24 10:07:10 · 2118 阅读 · 1 评论 -
手写一个 webpack 插件
webpack 是目前前端最流行的打包工具,在 webpack 的世界里,一切都可以看成是一个包模块。包括但不限于 JS,CSS,图片资源。webpack 本身只支持打包 JS 文件。其他的资源比如 CSS 和 图片只能通过 loader 进行编译后进行打包。打包之后的 CSS 和 JS 混在一个文件中。如果想要将 CSS 单独提取出来就需要用到 plugins 插件。原创 2020-02-22 21:40:45 · 928 阅读 · 0 评论 -
webpack 性能优化
webpack 性能优化无非是从时间和空间两个维度去分析。时间指的是打包时间尽可能快;空间指的是打包体积尽可能小。本文的 webpack 性能优化是基于 webpack 4.3.0 版本。原创 2019-12-12 18:12:18 · 879 阅读 · 0 评论 -
wabpack 中 loader 和 plugins 的区别
webpack 是现在最流行的打包工具。使用过 webpack 的人对 loader 与 plugins 一定不会陌生。虽然在 webpack 中万物皆模块,但是 webpack 真正认识的也只不过 js 文件而已。那么其他的文件比如 CSS 或者图片也想打包成模块应该怎么办呢,这就需要借助 loader 工具了。 另外,如果想对文件进行压缩减小体积应该怎么办呢,这时候 plugins 就可以登场了。那么 loader 与 plugins 到底有什么区别呢?原创 2019-12-10 13:39:45 · 810 阅读 · 0 评论 -
webpack 4 新特性
webpack 4 新特性:新增 webpack-cli,零配置,优化插件原创 2019-12-04 22:19:17 · 480 阅读 · 0 评论 -
webpack 常用配置
一、前言webpack是目前前端开发中最流行的打包工具,不仅能实现 JS 打包,还能将 CSS 文件,图片文件,甚至是 LESS 文件打包,每一个文件都是一个独立的模块,并且实现按需加载。使用时需要安装 webpack 、webpack-cli 、webpack-dev-server三个基础模块。二、常用 webpack 配置如下module.exports = { ...原创 2019-05-06 09:06:25 · 13294 阅读 · 2 评论 -
彻底理解并解决 'webpack' 不是内部或外部命令,也不是可运行的程序或批处理文件
彻底理解并解决 'webpack' 不是内部或外部命令,也不是可运行的程序 或批处理文件一、问题描述二、分析原因三、解决方案四、方案对比一、问题描述在安装 npm 包模块的时候,不管是 Webpack 、React 还是 Vue,都需要全局安装,即执行 npm install webpack -g 或者 npm install @vue/cli -g,否则在使用命令(比如查看版本,webpac...原创 2019-07-09 16:37:24 · 55893 阅读 · 15 评论