使用parcel报错regeneratorRuntime is not defined和parcelRequire is not defined
使用parcel报错regeneratorRuntime is not defined
使用parcel打包部署js文件后发现控制台报错
报错信息
解决方法
Parcel使用的 Babel会生成一个 polyfill,但为避免此错误,您还需要加载regenerator-runtime运行库。
两种解决方法:
1.添加到主 JavaScript 文件的顶部:
import 'regenerator-runtime/runtime'
Parcel 默认会包含这个包,增加 25KB 的大小。
如果没有效果先删除.cache文件
再试试
2.添加browserslist
最有效的解决方案是将browserslist
添加到您的 package.json。
例如:
"browserslist": [
"last 1 Chrome version"
]
支持多种浏览器:
"browserslist": [
"last 3 and_chr versions",
"last 3 chrome versions",
"last 3 opera versions",
"last 3 ios_saf versions",
"last 3 safari versions"
]
或者:
"browserslist": [
"since 2017-06"
]
报错原因
因为browserslist
可以根据提供的目标浏览器的环境来智能添加css前缀,js的polyfill垫片来兼容旧版本浏览器。避免不必要的兼容代码,以提高代码的编译质量。当没有该属性时Babel 不会尝试添加 polyfill垫片,需要自己手动添加regenerator-runtime运行库。
当生成器函数、async、await函数经babel编译后,添加的regenerator-runtime模块用于提供功能实现。
查看更多browserslist
相关:
报错 parcelRequire is not defined
项目打包入口是一个使用了import等模块化语法的index.js静态文件,将其导入进静态html,使用parcel打包部署后控制台就会报错。
<script src="../index.js" type="module"></script>
报错信息
解决方法
1.在浏览器下载该script脚本后解析前 我们可以先定义该变量
var parcelRequire;
或者第二种方法
2.删除脚本的type属性
<script src="../index.js"></script>
即可解决问题
其他解决方法可以查看第二篇参考来源
报错原因
这是parcelRequire严格模式中定义方式的问题。
ES6 模块默认以严格模式 (AFIK) 执行,该模式禁止隐式变量声明。