从零到一: 创建一个 TypeScript 7 项目
本文介绍如何创建一个基于 TypeScript 7 的 Node.js 项目。项目使用 ECMAScript 模块 (ESM)，并保留两条构建路径：TypeScript 编译器生成可发布文件，webpack 生成独立 bundle。
标签： webpack
[EN] Using Multiple Configurations in webpack: Exporting an Array of Config Objects
webpack supports enabling multi-compiler mode by exporting an array of configuration objects, allowing multiple entries and bundles to be managed within a single process. This approach unifies build and watch workflows, reduces the complexity of multiple config files, and still supports targeted builds via name (config-name), balancing efficiency, maintainability, and flexibility.
[ZH] webpack 中使用多配置: 导出配置对象数组
通过导出配置对象数组，可在 webpack 中启用多编译器模式，实现多入口与多 bundle 的统一构建与监听。该方式简化流程、降低维护成本，并支持共享配置与按需执行 (config-name)，适用于复杂项目的高效管理与扩展。
使用 webpack-merge 合并 webpack 配置
使用 webpack-merge 将多环境配置合并，减少入口、加载器等重复内容，并支持以 common 为基础扩展 dev 与 prod 配置。示例展示了常用 loader、缓存、静态资源处理、开发模式的源码映射与 dev server 设置，以及生产模式中通过 mergeWithRules 替换样式链路并优化构建体积。
webpack 常用配置
本文收录了 webpack 相关的基础语法、环境配置、优化、部署等实用教程，方便快速查阅。
前端性能和加载体验优化实践 (附: PWA、离线包、内存优化、预渲染)
探讨了页面加载卡顿的原因并提出了多种优化方法。主要原因包括项目包或第三方脚本过大、JavaScript 执行阻塞页面加载、图片体积大且多等。优化策略包括构建缩包按需加载、减少图片体积等。文章还详细介绍了如何通过 Webpack 插件分析项目中用到的 npm 包及大小，以及如何通过调整图片尺寸、格式转换、压缩等方式减小图片体积。
Node.js 使用 SCP + SSH 部署项目
本文介绍了如何在无法直接访问 GitLab 的生产环境中，通过 SCP 和 SSH 实现代码上传及项目重启。利用 scp2 和 ssh2 npm 包完成文件传输与命令执行，并通过 webpack 打包脚本以适配 GitLab CI/CD 环境，解决依赖缺失问题，实现自动化部署。
webpack 只打包 CSS
介绍了如何使用 Webpack 单独打包 CSS 文件，通过设置“傀儡”入口文件 (style.js 和 index.style.html)，结合 MiniCssExtractPlugin 和 HtmlWebpackPlugin 插件实现 CSS 文件的独立构建。提供了详细的配置示例，适用于处理零散项目的模块化打包需求。
使用 webpack-bundle-analyzer 分析与优化构建体积
使用 webpack-bundle-analyzer 可可视化分析构建产物并生成 stats.json，帮助定位体积来源。结合 ESBuild 或 SWC 加速转译、优化 Terser 参数、配置 Tree Shaking 与 sideEffects、压缩图片、替换大型依赖，可有效缩小最终 bundle 并提升构建性能。
使用 Babel 编译 TypeScript
使用 ts-loader 在构建打包生产代码时面对重重问题，比如 Polyfill 的自动注入等，于是转变为用 Babel 来编译 TypeScript。