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引入:

相关推荐
YCY^v^20 分钟前
JeecgBoot 项目运行指南
java·学习
云小逸27 分钟前
【nmap源码解析】Nmap OS识别核心模块深度解析:osscan2.cc源码剖析(1)
开发语言·网络·学习·nmap
JustDI-CM1 小时前
AI学习笔记-提示词工程
人工智能·笔记·学习
悟纤1 小时前
学习与专注音乐流派 (Study & Focus Music):AI 音乐创作终极指南 | Suno高级篇 | 第33篇
大数据·人工智能·深度学习·学习·suno·suno api
爱写bug的野原新之助1 小时前
加密摘要算法MD5、SHA、HMAC:学习笔记
笔记·学习
ZH15455891312 小时前
Flutter for OpenHarmony Python学习助手实战:Web开发框架应用的实现
python·学习·flutter
百锦再2 小时前
Vue高阶知识:利用 defineModel 特性开发搜索组件组合
前端·vue.js·学习·flutter·typescript·前端框架
CappuccinoRose2 小时前
JavaScript 学习文档(二)
前端·javascript·学习·数据类型·运算符·箭头函数·变量声明
A9better2 小时前
C++——不一样的I/O工具与名称空间
开发语言·c++·学习
小乔的编程内容分享站2 小时前
C语言笔记之函数
c语言·笔记