Webpack学习笔记(9)

Shimming预置依赖

预置全局变量

例如lodash:

细颗粒度shimming

当模块运行在commonjs上下文中,this指向的是module.exports并不是window,所以可以覆盖一下。

安装npm i imports-loader -D

配置后this指向window:

全局Exports

全局导出一个模块:

加载Polyfills

当新的 JavaScript 特性或 API 被引入时,旧版浏览器可能不支持这些特性。Polyfills 通过提供与新特性相同功能的代码,使得这些特性在旧版浏览器中也能正常工作。

npm i @babel/polyfill -D

优化polyfill

不建议直接使用import @babel/polyfill,这样做会全局引入整个polyfill包,比如array.from全局引入,不但体积大,而且还会污染全局环境。使用babel-preset-env

npm i babel-loader @babel/core @babel/preset-env -D

创建Library

自定义一个模块打包,可供使用

配置library,type可以设置为:window,commonjs,module,amd等等,可以设置为umd可满足多个type但不包括module

发布为npm-package

登录npm

npm config get registry

npm adduser输入用户名密码等

npm publish发布,其他人可以使用

使用时npm i 名字 -D

然后可以使用require引入:

相关推荐
超级大只老咪11 小时前
快速进制转换
笔记·算法
layman052813 小时前
webpack5 css-loader:从基础到原理
前端·css·webpack
Fᴏʀ ʏ꯭ᴏ꯭ᴜ꯭.14 小时前
Keepalived VIP迁移邮件告警配置指南
运维·服务器·笔记
ling___xi14 小时前
《计算机网络》计网3小时期末速成课各版本教程都可用谢稀仁湖科大版都可用_哔哩哔哩_bilibili(笔记)
网络·笔记·计算机网络
星火开发设计15 小时前
类型别名 typedef:让复杂类型更简洁
开发语言·c++·学习·算法·函数·知识
Gorgous—l15 小时前
数据结构算法学习:LeetCode热题100-多维动态规划篇(不同路径、最小路径和、最长回文子串、最长公共子序列、编辑距离)
数据结构·学习·算法
中屹指纹浏览器16 小时前
中屹指纹浏览器底层架构深度解析——基于虚拟化的全维度指纹仿真与环境隔离实现
经验分享·笔记
Hello_Embed16 小时前
libmodbus 移植 STM32(基础篇)
笔记·stm32·单片机·学习·modbus
无聊的小坏坏16 小时前
实习笔记:用 /etc/crontab 实现定期数据/日志清理
笔记·实习日记