[React.js]尝试导入错误:'./registerServiceWorker' 不包含默认导出(导入为'registerServiceWorker')
Posted
技术标签:
【中文标题】[React.js]尝试导入错误:\'./registerServiceWorker\' 不包含默认导出(导入为\'registerServiceWorker\')【英文标题】:[React.js]Attempted import error: './registerServiceWorker' does not contain a default export (imported as 'registerServiceWorker')[React.js]尝试导入错误:'./registerServiceWorker' 不包含默认导出(导入为'registerServiceWorker') 【发布时间】:2020-05-18 08:45:25 【问题描述】:我正在尝试创建一个获取 pokemon API 的反应应用程序,但我遇到了以下问题,提示尝试导入错误:'./registerServiceWorker' 不包含默认导出(导入为'registerServiceWorker')。但我的 App.js 文件中确实有一个export default App;
,这是我的以下内容,不太确定是什么问题,将不胜感激。
App.js
import React, Component from 'react';
import './styles/App.css';
class App extends Component
render()
return (
<div className="App">
hellohello
</div>
);
export default App;
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './components/App';
import registerServiceWorker from './registerServiceWorker';
ReactDOM.render(<App />, document.getElementById('root'));
registerServiceWorker();
const isLocalhost = Boolean(
window.location.hostname === 'localhost' ||
// [::1] is the IPv6 localhost address.
window.location.hostname === '[::1]' ||
// 127.0.0.0/8 are considered localhost for IPv4.
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))3$/
)
);
export function register(config)
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator)
const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
if (publicUrl.origin !== window.location.origin)
return;
window.addEventListener('load', () =>
const swUrl = `$process.env.PUBLIC_URL/service-worker.js`;
if (isLocalhost)
checkValidServiceWorker(swUrl, config);
navigator.serviceWorker.ready.then(() =>
console.log(
'This web app is being served cache-first by a service ' +
'worker.'
);
);
else
registerValidSW(swUrl, config);
);
function registerValidSW(swUrl, config)
navigator.serviceWorker
.register(swUrl)
.then(registration =>
registration.onupdatefound = () =>
const installingWorker = registration.installing;
if (installingWorker == null)
return;
installingWorker.onstatechange = () =>
if (installingWorker.state === 'installed')
if (navigator.serviceWorker.controller)
console.log(
'New content is available and will be used when all ' +
'tabs for this page are closed.'
);
if (config && config.onUpdate)
config.onUpdate(registration);
else
console.log('Content is cached for offline use.');
if (config && config.onSuccess)
config.onSuccess(registration);
;
;
)
.catch(error =>
console.error('Error during service worker registration:', error);
);
function checkValidServiceWorker(swUrl, config)
fetch(swUrl,
headers: 'Service-Worker': 'script'
)
.then(response =>
const contentType = response.headers.get('content-type');
if (
response.status === 404 ||
(contentType != null && contentType.indexOf('javascript') === -1)
)
navigator.serviceWorker.ready.then(registration =>
registration.unregister().then(() =>
window.location.reload();
);
);
else
registerValidSW(swUrl, config);
)
.catch(() =>
console.log(
'No internet connection found. App is running in offline mode.'
);
);
export function unregister()
if ('serviceWorker' in navigator)
navigator.serviceWorker.ready.then(registration =>
registration.unregister();
);
【问题讨论】:
也粘贴此文件 (registerServiceWorker.js) 代码。 @GangadharGandi 是的,我已经粘贴了,谢谢。 【参考方案1】:您的模块没有默认导出。它有一个命名导出register
。
您可以使用别名registerServiceWorker
导入它:
import register as registerServiceWorker from './registerServiceWorker';
【讨论】:
以上是关于[React.js]尝试导入错误:'./registerServiceWorker' 不包含默认导出(导入为'registerServiceWorker')的主要内容,如果未能解决你的问题,请参考以下文章
React.JS - 我正在尝试将 .js 文件中的函数导入 .jsx 文件,但它仍然不起作用。无法读取 null 的属性“单击”