From 06573e37d760f9348f43a56b8eb0f38596aa80af Mon Sep 17 00:00:00 2001
From: Roe-xin <xiang200308037300@qq.com>
Date: Fri, 6 Mar 2026 18:27:56 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=20webpack=20?=
 =?UTF-8?q?=E6=89=93=E5=8C=85=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

   - 添加自动模式切换（开发/生产）
   - 启用 Tree Shaking 移除未使用代码
   - 加快编译速度（transpileOnly）
   - 添加打包体积监控
   - 自动清理旧文件
   - 添加打包优化文档
---
 docs/webpack-optimization.md | 55 ++++++++++++++++++++++++++++++++++++
 webpack.config.js            | 42 ++++++++++++++++++---------
 2 files changed, 83 insertions(+), 14 deletions(-)
 create mode 100644 docs/webpack-optimization.md

diff --git a/docs/webpack-optimization.md b/docs/webpack-optimization.md
new file mode 100644
index 0000000..43629f8
--- /dev/null
+++ b/docs/webpack-optimization.md
@@ -0,0 +1,55 @@
+# Webpack 打包优化说明
+
+## 优化内容
+
+### 1. 自动模式切换
+- 开发模式：保持源码可读性
+- 生产模式：自动压缩代码
+
+### 2. 性能优化
+- **Tree Shaking**：移除未使用的代码
+- **transpileOnly**：跳过类型检查，加快编译速度
+- **自动清理**：每次打包自动删除旧文件
+
+### 3. 体积监控
+- 单文件超过 2MB 会发出警告
+- 帮助及时发现打包体积问题
+
+## 使用方法
+
+### 开发模式
+```bash
+# 编译（不压缩）
+pnpm run compile
+
+# 监听模式（自动重新编译）
+pnpm run watch
+```
+
+### 生产模式
+```bash
+# Windows
+set NODE_ENV=production && pnpm run package
+
+# macOS/Linux
+NODE_ENV=production pnpm run package
+```
+
+## 打包结果
+
+- **输出目录**：`dist/`
+- **入口文件**：`dist/extension.js`
+- **静态资源**：`dist/assets/`
+
+## 性能对比
+
+| 模式 | 体积 | 编译速度 | Source Map |
+|------|------|----------|------------|
+| 开发 | 较大 | 快 | 完整 |
+| 生产 | 小 | 较慢 | 隐藏 |
+
+## 注意事项
+
+1. 开发时使用 `pnpm run watch`，修改代码自动重新编译
+2. 发布前必须使用生产模式打包
+3. 如果打包体积超过 2MB，检查是否引入了不必要的依赖
diff --git a/webpack.config.js b/webpack.config.js
index 453c32c..5ee64d2 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -10,24 +10,23 @@ const CopyWebpackPlugin = require('copy-webpack-plugin');
 
 /** @type WebpackConfig */
 const extensionConfig = {
-  target: 'node', // VS Code extensions run in a Node.js-context 📖 -> https://webpack.js.org/configuration/node/
-	mode: 'none', // this leaves the source code as close as possible to the original (when packaging we set this to 'production')
+  target: 'node',
+  mode: process.env.NODE_ENV === 'production' ? 'production' : 'none',
 
-  entry: './src/extension.ts', // the entry point of this extension, 📖 -> https://webpack.js.org/configuration/entry-context/
+  entry: './src/extension.ts',
   output: {
-    // the bundle is stored in the 'dist' folder (check package.json), 📖 -> https://webpack.js.org/configuration/output/
     path: path.resolve(__dirname, 'dist'),
     filename: 'extension.js',
-    libraryTarget: 'commonjs2'
+    libraryTarget: 'commonjs2',
+    clean: true // 自动清理旧文件
   },
   externals: {
-    vscode: 'commonjs vscode', // the vscode-module is created on-the-fly and must be excluded. Add other modules that cannot be webpack'ed, 📖 -> https://webpack.js.org/configuration/externals/
-    'node-notifier': 'commonjs node-notifier' // node-notifier 依赖原生模块，必须排除
-    // modules added here also need to be added in the .vscodeignore file
+    vscode: 'commonjs vscode',
+    'node-notifier': 'commonjs node-notifier'
   },
   resolve: {
-    // support reading TypeScript and JavaScript files, 📖 -> https://github.com/TypeStrong/ts-loader
-    extensions: ['.ts', '.js']
+    extensions: ['.ts', '.js'],
+    mainFields: ['module', 'main']
   },
   module: {
     rules: [
@@ -36,15 +35,21 @@ const extensionConfig = {
         exclude: /node_modules/,
         use: [
           {
-            loader: 'ts-loader'
+            loader: 'ts-loader',
+            options: {
+              transpileOnly: true, // 加快编译速度
+              compilerOptions: {
+                sourceMap: true
+              }
+            }
           }
         ]
       }
     ]
   },
-  devtool: 'nosources-source-map',
+  devtool: process.env.NODE_ENV === 'production' ? 'hidden-source-map' : 'nosources-source-map',
   infrastructureLogging: {
-    level: "log", // enables logging required for problem matchers
+    level: "log",
   },
   plugins: [
     new CopyWebpackPlugin({
@@ -52,6 +57,15 @@ const extensionConfig = {
         { from: 'src/assets', to: 'assets' }
       ]
     })
-  ]
+  ],
+  optimization: {
+    minimize: process.env.NODE_ENV === 'production',
+    usedExports: true // Tree Shaking
+  },
+  performance: {
+    hints: 'warning',
+    maxAssetSize: 2 * 1024 * 1024, // 2MB
+    maxEntrypointSize: 2 * 1024 * 1024
+  }
 };
 module.exports = [ extensionConfig ];
\ No newline at end of file