前端代码 Jenkins 线上打包报错:TypeError: StackFrame is not a constructor
两个月没来公司上班,今日开工遇到一个及其有意思的问题:Jenkins 线上打包前端代码,在控制台日志中打包的时候报错:因为疫情期间大家都是居家办公,Jenkins 服务器配置和前端项目配置都没有改动,所以看到这种报错一时无从下手,但是可以看出这是引入出了问题,具体啥问题下面梳理一下;1、翻译报错信息猛的一看不知道这个到底是啥意思;2、查找 babel 配置项目是 vue-cli3 搭建的,找到了
两个月没来公司上班,今日开工遇到一个及其有意思的问题:Jenkins 线上打包前端代码,在控制台日志中打包的时候报错:
When setting `useBuiltIns: 'usage'`, polyfills are automatically imported when needed.
Please remove the direct import of `@babel/polyfill` or use `useBuiltIns: 'entry'` instead.
ERROR TypeError: StackFrame is not a constructor
因为疫情期间大家都是居家办公,Jenkins 服务器配置和前端项目配置都没有改动,所以看到这种报错一时无从下手,但是可以看出这是 @babel/polyfill
引入出了问题,具体啥问题下面梳理一下;
1、翻译报错信息
当设置' useBuiltIns: 'usage'时,需要的时候会自动导入腻子脚本。
请删除直接导入' @babel/polyfill '或使用' useBuiltIns: 'entry'代替。
猛的一看不知道这个到底是啥意思;
2、查找 babel 配置
项目是 vue-cli3 搭建的,找到了 babel.config.js 文件:
module.exports = {
presets: [
// https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app
'@vue/cli-plugin-babel/preset'
]
}
vue/cli-plugin-babel/preset 在 node_module 里面看的话最后引用的是 vue/babel-preset-app 也就是代码中注释的地址:https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app
3、vue/babel-preset-app 中的 useBuiltIns
在 vue/babel-preset-app 预设中可以看到关于 useBuiltIns 的配置:
大概意思如下:
usage:默认值,按需加载 polyfill,且不需要手动引入@babel/polyfill 文件,如果引入了控制台在打包时会报错(如上);
entry:需要在入口文件手动引入 @babel/polyfill ,如果不引入则会报错;
false:不管引入与否都不会处理 polyfill;
所以针对本文的问题,需要在入口文件 main.js 中查看是否引入了 @babel/polyfill 文件,如果引入了直接删掉就可以了 ;
更多推荐
所有评论(0)