feat: 优化 webpack 打包配置

- 添加自动模式切换(开发/生产)
   - 启用 Tree Shaking 移除未使用代码
   - 加快编译速度(transpileOnly)
   - 添加打包体积监控
   - 自动清理旧文件
   - 添加打包优化文档
This commit is contained in:
Roe-xin
2026-03-06 18:27:56 +08:00
parent d740f4da44
commit 06573e37d7
2 changed files with 83 additions and 14 deletions

View File

@ -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 ];