使用vite-plugin-top-level-await后Vite构建产物缺失SourceMapURL注释的原因咨询
vite-plugin-top-level-await后Vite构建产物缺失SourceMapURL注释的原因咨询
最近碰到一个挺奇怪的问题,想请教下各位开发者:
我在Vite配置中引入vite-plugin-top-level-await插件后,执行vite build生成的JS产物末尾完全没有自动添加//# sourceMappingURL=xxx.js.map注释;但只要把这个插件移除,构建出来的JS文件末尾就会正常出现类似//# sourceMappingURL=index-Cqqbffuz.js.map的注释,SourceMap也能正常关联。
我的配置与代码情况
1. Vite完整配置文件
import { defineConfig } from "vite"; import react from "@vitejs/plugin-react"; import path from "node:path"; import svgr from "vite-plugin-svgr"; import topLevelAwait from "vite-plugin-top-level-await"; import commonjs from "@rollup/plugin-commonjs"; export default defineConfig({ define: { "process.env": JSON.stringify({ NODE_ENV: "production", }), }, plugins: [ commonjs(), react(), svgr({ svgrOptions: {}, include: "**/*.svg?react", }), topLevelAwait(), ], optimizeDeps:{ exclude: [] }, build: { commonjsOptions: { include: [] }, outDir: "build", sourcemap: true, rollupOptions: {}, }, resolve: { alias: { "@": path.resolve(__dirname, "src"), "~bootstrap": path.resolve(__dirname, "node_modules/bootstrap") }, }, });
2. 入口文件src/index.tsx
import * as React from 'react'; import ReactDOM from 'react-dom/client'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot( document.getElementById('root') as HTMLElement ); root.render( <React.StrictMode> <div/> </React.StrictMode> ); reportWebVitals();
3. 核心依赖版本
{ "vite": "7.1.3", "vite-plugin-top-level-await": "^1.6.0", "@vitejs/plugin-react": "^4.7.0" }
我的疑问与尝试
我已经确认build.sourcemap设置为true,且移除topLevelAwait插件后SourceMapURL完全正常生成,说明基础配置没有问题。我也尝试过调整插件在plugins数组中的顺序(比如把topLevelAwait()放在最后),但问题依然存在。
想请教下:为什么启用这个插件会导致SourceMapURL注释消失?有没有办法在保留顶层await支持的同时,让SourceMapURL正常生成?或者有没有排查这个问题的具体方向?感谢各位的帮助!




