项目打包出来的js文件为什么都带有.map文件

最新推荐文章于 2024-05-13 17:15:40 发布
最新推荐文章于 2024-05-13 17:15:40 发布
阅读量4.3k 收藏 6
点赞数 2
分类专栏： vue webpack 文章标签： vue 前端 webpack
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zyhzyh1120/article/details/108692617
版权
vue 同时被 2 个专栏收录
12 篇文章 0 订阅
订阅专栏
webpack
2 篇文章 0 订阅
订阅专栏

项目打包出来的js文件为什么都带有.map文件

打包后产生后缀名为.map的文件是由于配置了sourcemap选项生成的，
打包后的文件不容易找到出bug对应的源代码的位置，sourcemap就是来帮我们解决这个问题的，
有了map就可以像未压缩的代码一样，准确的输出是哪一行哪一列有错。
具体配置可以查看官网devtool配置
或者其它的webpack sourcemap 选项多种模式的一些解释

如果想要打包后不生成.map文件要怎么配置呢？

去config/index.js中改一个参数就行：?

productionSourceMap:false

即productionSourceMap:true改为false就行，建议还是不要删或者配置不生成map文件，
万一打包后的代码有问题不好定位问题！

zyhzyh1120
关注
  • 2
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
webpack将js打包后的map文件详解
11-26
类似于这样的map文件 由webpack自动生成 参数： devtool: ‘#eval-source-map’,//映射js到原文件 由于打包后的js调试不方面，所以应用此，自动映射报错到原文件 还是很有用的 同样的css设置如下 { test: /\.css$/, loader: 'style-loader!css-loader?sourceMap' } 以上这篇webpack将js打包后的map文件详解是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持软件开发网。
【渗透测试笔记】之【拒绝服务攻击】_拒绝服务攻击的代码(1)
2401_84971562的博客
05-13 340
自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。深知大多数网络安全工程师，想要提升技能，往往是自己摸索成长，但自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！因此收集整理了一份《2024年网络安全全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友。既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上网络安全知识点！真正的体系化！
Vue打包后JS文件夹中出现一些map文件的解决方法(map.js文件移除掉)
有问题可关注公众号：前端研究院 后台输入问题回复
02-05 1120
1.在项目下进入目录：项目包/config/index.js 找到productionSourceMap /* Source Maps */ productionSourceMap: true, // 把这边的true改为false // https://webpack.js.org/configuration/devtool/#production devtool: '#source-map', productionSourceMap: true, ..
【网络安全】WebPack源码（前端源码）泄露 + jsmap文件还原_webpack还原代码sourcemap
最新发布
2401_84973153的博客
05-13 884
自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。深知大多数网络安全工程师，想要提升技能，往往是自己摸索成长，但自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！因此收集整理了一份《2024年网络安全全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友。既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上网络安全知识点！真正的体系化！
webpack打包生成的map文件_【webpack】你所不知道的sourceMap
weixin_31047023的博客
02-05 5193
sourceMap的作用通常，js代码出错，控制台会提示第几行第几列代码出错。但是webpack打包压缩后的代码，都被压缩到了一行，变量也变成了a,b,c,d。代码出错，控制台就没法正确的提示错误位置。sourceMap就可以解决这个问题。sourceMap就是一个信息文件，里面储存着打包前的位置信息。也就是说，转换后的代码的每一个位置，所对应的转换前的位置。具体如何编码，可以看下阮一峰的文章。有...
js.map文件
wei_dan1129的博客
06-30 9228
什么是source map文件 source map文件是js文件压缩后，文件的变量名替换对应、变量所在位置等元信息数据文件，一般这种文件和min.js主文件放在同一个目录下。 比如压缩后原变量是map，压缩后通过变量替换规则可能会被替换成a，这时source map文件会记录下这个mapping的信息，这样的好处就是说，在调试的时候，如果有一些JS报错，那么浏览器会通过解析这个map文件来重新merge压缩后的js,使开发者可以用未压缩前的代码来调试，这样会给我们带来很大的方便！ 而这种还原性调试功能，所
前端源码泄露
lyink001的博客
12-16 3046
攻击者可以通过泄露的前端源代码可以针对源代码对代码中各种信息如隐蔽接口、API、加密算法、管理员邮箱、内部功能等等，或者接口API可以尝试未授权漏洞，拼接接口越权漏洞，查找源代码中关键字去GitHub查找程序源码进行代码审计。
前端js.map文件泄露
weixin_60965776的博客
11-20 2162
转换后的代码的每一个位置，所对应的转换前的位置。有了它，出错的时候，除错工具将直接显示原始代码，而不是转换后的代码,这无疑给开发者带来了很大方便。在日常测试时，经常会遇到以js.map为后缀的文件，非常多Webpack打包的站点都会存在js.map文件.，通过sourcemap可还原前端代码找到API,间接性获取未授权访问漏洞，什么是Source map。下载好js.map文件后就是逆向还原操作，我们用到的工具reverse-sourcemap。-o：还原后的目录，-v：需要还原的文件。
用原生js实现map方法
m0_67393593的博客
03-24 308
我们平时用的是已经封装好的map方法，如果让我们自己封装一个map，应该如何实现。 万变不离其宗，其实遍历数组的核心还是for循环。因此下面封装一个map方法。 思路： 1.在原型上添加一个方法 2.传一个函数和this 3.call 方法传的参数和封装好的map方法的参数是一样的。 Array.prototype.fakeMap = function(fn,context) { let arr = this; let temp = []; for(let i=0;i<arr.length;i+
rollup-module-boilerplate:带有rollup.js的NPM模块样板
04-11
在NPM模块项目中，通常有一个名为`rollup.config.js`的配置文件，用于定义Rollup的行为。在这个配置文件中，你可以设置输入文件、输出格式、插件列表等选项。样板项目中的配置可能已经包含了基本的设置，帮助快速...
详解webpack+vue-cli项目打包技巧
11-30
在现代前端开发中，Webpack 和 Vue CLI 是两个非常重要的工具，它们帮助开发者高效地管理和...不过，需要注意的是，每个项目都有其特定需求，因此在实际操作中，应根据项目的具体情况进行调整，找到最适合的打包策略。
webpack-move:webpak打包项目已集成jq
05-12
这个"webpack-move-master"压缩包文件很可能包含了项目的所有源码、Webpack配置文件（webpack.config.js）、package.json（定义项目依赖和脚本）、Sass文件以及其他必要的资源文件。为了开始开发或理解这个项目，你...
JapanMap:日本地图是带有鼠标突出显示的日本地图
06-14
在描述中，“日本地图是带有鼠标突出显示的日本地图”说明了该程序的核心特性。当用户的鼠标指针移动到地图的特定区域时，该区域会以某种方式突出显示，可能是改变颜色、增加边框、显示详细信息等，这种交互性提高了...
gulp-flatten：Gulp插件：删除或替换文件的相对路径
02-03
安装npm install gulp-flatten用法带有凉亭成分的示例源目录： ├── angular│ ├── README.md│ ├── angular-csp.css│ ├── angular.js│ ├── angular.min.js│ └── bower.json├── angular...
vue打包后生成map文件调试
qq_41177135的博客
06-19 1059
vue打包后生成map文件调试
去除：Vue项目打包后生成的.map文件&文件hash值命名
michiko98的博客
03-21 1417
文件中设置productionSourceMap和filenameHashing项为false即可。
【网络安全】WebPack源码（前端源码）泄露 + jsmap文件还原
等风来
04-09 2948
webpack是一个JavaScript应用程序的静态资源打包器。它构建一个依赖关系图，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个bundle。大部分Vue等项目应用会使用webpack进行打包，使用webpack打包应用程序会在网站js同目录下生成 js.map文件。
Vue打包后JS文件夹中出现一些map文件的解决方法(map.js文件移除掉
weixin_43738802的博客
05-06 2028
Vue打包后JS文件夹中出现一些map文件的解决方法(map.js文件移除掉) 1.在项目下进入目录：项目包/config/index.js 找到productionSourceMap /* Source Maps */ productionSourceMap: true, // 把这边的true改为false // https://webpack.js.org/configuration/devtool/#production devtool: '#source
将Matlab的配色文件导出为Tecplot可识别的.map格式
06-13
可以使用以下Matlab脚本将Matlab的配色文件导出为Tecplot可识别的.map格式： ```matlab % 读取Matlab的配色文件 cmap = colormap; % 将RGB颜色转换为Tecplot可识别的格式 map = cmap.*255; map = round(map); % 将颜色保存为.map文件 filename = 'mycolormap.map'; fid = fopen(filename, 'wt'); for i=1:length(map) fprintf(fid, '%d %d %d\n', map(i,1), map(i,2), map(i,3)); end fclose(fid); ``` 运行这个脚本后，你将得到一个名为`mycolormap.map`的文件，它包含了Matlab配色文件中的所有颜色，并且可以被Tecplot识别。你可以将这个文件导入到Tecplot中，并将其应用到你的数据集中。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值