柳枝 发表于 2024-6-11 11:42:49

vite build vue3项目配置开启sourcemap方式

在Vue 3项目中,配置Sourcemap主要取决于你使用的构建工具,通常是Vue CLI或者Vite。
下面是在这两种情况下如何开启Sourcemap的步骤:

Vue CLI

对于使用Vue CLI创建的项目,可以在项目的vue.config.js文件中配置:

[*]1.找到或者在项目根目录下创建一个vue.config.js文件。
[*]2.修改或添加配置项以开启sourcemap。对于生产环境和开发环境,你可以分别配置:
module.exports = {
configureWebpack: {
    devtool: 'source-map',
    // 为不同的环境设置不同的source-map
    productionSourceMap: true,
}
}这个配置将会在开发环境和生产环境开启sourcemap。

Vite

如果你的项目使用的是Vite,Vite 默认在开发模式下启用了sourcemap。
如果你需要控制sourcemap的生成,可以在vite.config.js文件中进行设置:

[*]1.找到或者在项目根目录下创建一个vite.config.js文件。
[*]2.修改配置以控制sourcemap。例如,要在生产环境中启用sourcemap,可以进行如下配置:
import { defineConfig } from 'vite';

export default defineConfig({
build: {
    sourcemap: true, // 或者使用 'inline' 等其他选项
}
});这样配置后,无论是在开发环境还是在生产环境,sourcemap都会根据你的设置被生成。

注意

sourcemap可以帮助你进行错误的追踪和调试,但在生产环境中启用sourcemap可能会暴露源代码。
确保在你发布应用至生产环境时考虑到安全因素,需要根据实际情况判断是否开启sourcemap。
var code = “552ec044-e227-44d3-815b-e06c121c1563”
总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

来源:https://www.jb51.net/javascript/322317bnb.htm
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: vite build vue3项目配置开启sourcemap方式