在 Vue-Vite 中启用源映射

Question

是否可以在生产环境中启用 Vue-Vite 中的源映射？

我想将它用于 Bugsnag。

在文档中找不到任何有关它的信息。

在开发中，它开箱即用。

Answer 1

感谢@tony19，我可以找到它：

从 vue ~2.0 开始，它的工作方式如下：

在<projectRoot>/vite.config.js：

/**
* @type {import('vite').UserConfig}
*/
export default {
    plugins: [vue()],
    build: {
        sourcemap: true,
    },
}

Answer 2

Vite 2.x（文档）：

// vite.config.js
export default {
  build: {
    sourcemap: true,
  },
}

维特1.x：

// vite.config.js
export default {
  sourcemap: true,
}

Answer 3

我在用着Vite 2.9，但浏览器未加载 CSS 源映射。（我也在使用 Typescript，以防与您相关。）

基于 @types for vite.config.ts，有一个devSourcemap属性css可以设置为true。

这是vite.config.ts我当前正在使用的文件：

import ...;
...

export default defineConfig({
  plugins: [
    vue(),
    checker({
      typescript: true,
      vueTsc: true,
    }),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url)),
    },
  },
  css: {
    devSourcemap: true,
  },
});

Answer 4

我在我的项目中使用 sass 并将其添加到我的 vite.config.js 中，并获得了 css 源映射。

        import { defineConfig } from 'vite'
        
        // https://vitejs.dev/config/
        export default defineConfig({
          css: {
            devSourcemap: true,
          },
        })