延迟Promise/单项目多npm版本/webpack好处/webpack5构建速度

1. Promise 行为描述

《Promise.withResolvers 延迟 Promise》https://sorrycc.com/promise-with-resolvers/promise 当Promise被reject之后，再次尝试resolve，仍然会返回最初的reject消息。

2. npm包的多个版本

延伸个小知识：

npm install jquery2@npm:jquery@2

jquery2 是你指定的别名。
@npm: 是固定格式，表示你要为接下来的包名创建别名。
jquery 是实际的包名。
@2 是实际包的版本号。

还有这种形式
如果你的包不在 npm 公开库中，可以使用自定义的包注册表或直接从本地或远程地址安装包。
npm install my-package-alias@npm:git+https://github.com/username/repo.git#v1.0.0
这种方式要注意以下几点
1. 提前编译并发布。确保 dist 目录在 .gitignore 文件中没有被忽略。
2. 在 my-private-package 的 package.json 中配置 main 字段指向编译后的入口文件（例如 dist/index.js）
这样就可以直接 import MyPrivatePackage from 'my-private-package';

3. Webpack的好处

• 需要通过模块化的方式来开发。
• 使用高级特性来加快开发效率或提高安全性，例如使用ES6+、TypeScript来开发脚本逻辑，通过Sass、Less等预处理器来编写CSS样式代码。
• 监听文件变化并实时将更改反映到浏览器上，以提高开发效率。
• JavaScript代码需要模块化处理，HTML和CSS等资源文件也面临着被模块化的需求。
• 开发完成后，还需要对代码进行压缩、合并及其他相关优化操作。

4. Webpack 5优化策略

• cache:{ type: 'filesystem' }
• 通过include src 和 excludenode_modules优化Loader配置。
• Module Federation：利用模块联邦共享模块或库。
• resolve.extensions：优化后缀解析，减少解析时间。
• resolve.alias：设置别名，提高模块解析速度。
• 移除不必要的插件和loader，简化构建过程。
• 使用terser-webpack-plugin开启多线程压缩，加速构建过程。