[英]TypeScript React Babel ReferenceError: Can't find variable: regeneratorRuntime
我正在学习打字稿、反应和 babel。 这是我的代码
export default function App() : JSX.Element {
console.log('+++++ came inside App +++++++ ');
const {state, dispatch} = useContext(Store);
useEffect(() => {
console.log('came inside use effect')
state.episodes.length === 0 && fetchDataAction()
});
const fetchDataAction = async () => {
console.log('came inside fetch data');
const URL = 'https://api.tvmaze.com/singlesearch/shows?q=rick-&-morty&embed=episodes';
const data = await fetch(URL);
const dataJson = await data.json();
return dispatch({
type: 'FETCH_DATA',
payload: dataJson._embedded.episodes
})
}
return (
<Fragment>
<h1>Rick and Morty</h1>
<p>Pick your favorite episode!!!</p>
{console.log(state)}
</Fragment>
)
}
当我尝试从我的组件进行同步调用时出现此错误
ReferenceError: Can't find variable: regeneratorRuntime
(anonymous function) — App.tsx:29
App — App.tsx:63
renderWithHooks — react-dom.development.js:16260
mountIndeterminateComponent — react-dom.development.js:18794
callCallback — react-dom.development.js:336
dispatchEvent
invokeGuardedCallbackDev — react-dom.development.js:385
invokeGuardedCallback — react-dom.development.js:440
beginWork$$1 — react-dom.development.js:25780
performUnitOfWork — react-dom.development.js:24698
workLoopSync — react-dom.development.js:24671
performSyncWorkOnRoot — react-dom.development.js:24270
scheduleUpdateOnFiber — react-dom.development.js:23698
updateContainer — react-dom.development.js:27103
(anonymous function) — react-dom.development.js:27528
unbatchedUpdates — react-dom.development.js:24433
legacyRenderSubtreeIntoContainer — react-dom.development.js:27527
Eval Code — index.tsx:13
eval
./src/index.tsx — bundle.js:613
__webpack_require__ — bundle.js:20
Eval Code — client:2
eval
(anonymous function) — bundle.js:624
__webpack_require__ — bundle.js:20
(anonymous function) — bundle.js:84
Global Code — bundle.js:85
logCapturedError — react-dom.development.js:21843
我用谷歌搜索并找到了这个线程Async/Await ReferenceError: Can't find variable: regeneratorRuntime
但我仍然不知道这个人究竟做了什么来解决问题。 是否有人可以向我解释一下解决方案。 我不知道 polyfills 是什么。
这是我的全部代码,它显示了我的 babel 和 webpack 配置https://github.com/abhsrivastava/react-rick-and-morty
我一直在谷歌搜索和试验,我能够解决这个问题。 这是一个更一步一步的答案。
现在对.babelrc
文件进行以下更改
{
"presets": ["@babel/preset-env", "@babel/typescript", "@babel/react"],
"plugins": [
["@babel/plugin-transform-runtime",
{
"regenerator": true
}]
]
}
进行这些更改后,所有4个问题都解决了
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.