我现在正在学习如何制作PWA,现在卡在了维修工,日志说导航器没有定义,怎么定义导航器呢?
我读到过导航器是browser?cmiiw的一个功能。那么我就不应该在我的应用程序上安装任何东西。我试着把代码移到我的登陆页面(home.ejs)和我的入口点(index.js),但都不起作用。我还在根文件夹上制作了sw.js文件。我也读过Google的教程,但我无法理解它。
这是日志
5:03:23 AM web.1 | > sakamichi-akb-chords@1.0.0 start /home/emil/Documents/Chord PWA
5:03:23 AM web.1 | > node index.js
5:03:23 AM web.1 | /home/emil/Documents/Chord PWA/index.js:5
5:03:23 AM web.1 | if ('serviceWorker' in navigator) {
5:03:23 AM web.1 | ^
5:03:23 AM web.1 | ReferenceError: navigator is not defined
5:03:23 AM web.1 | at Object.<anonymous> (/home/emil/Documents/Chord PWA/index.js:5:24)
5:03:23 AM web.1 | at Module._compile (module.js:652:30)
5:03:23 AM web.1 | at Object.Module._extensions..js (module.js:663:10)
5:03:23 AM web.1 | at Module.load (module.js:565:32)
5:03:23 AM web.1 | at tryModuleLoad (module.js:505:12)
5:03:23 AM web.1 | at Function.Module._load (module.js:497:3)
5:03:23 AM web.1 | at Function.Module.runMain (module.js:693:10)
5:03:23 AM web.1 | at startup (bootstrap_node.js:188:16)
5:03:23 AM web.1 | at bootstrap_node.js:609:3
5:03:23 AM web.1 | npm
5:03:23 AM web.1 | ERR!
5:03:23 AM web.1 | Linux 4.15.0-50-generic
5:03:23 AM web.1 | npm ERR!
5:03:23 AM web.1 | argv "/usr/bin/node" "/usr/bin/npm" "start"
5:03:23 AM web.1 | npm ERR! node v8.10.0
5:03:23 AM web.1 | npm ERR! npm v3.5.2
5:03:23 AM web.1 | npm ERR! code ELIFECYCLE
5:03:23 AM web.1 | npm ERR! sakamichi-akb-chords@1.0.0 start: `node index.js`
5:03:23 AM web.1 | npm ERR! Exit status 1
5:03:23 AM web.1 | npm ERR!
5:03:23 AM web.1 | npm ERR! Failed at the sakamichi-akb-chords@1.0.0 start script 'node index.js'.
5:03:23 AM web.1 | npm ERR! Make sure you have the latest version of node.js and npm installed.
5:03:23 AM web.1 | npm ERR! If you do, this is most likely a problem with the sakamichi-akb-chords package,
5:03:23 AM web.1 | npm ERR! not with npm itself.
5:03:23 AM web.1 | npm ERR!
5:03:23 AM web.1 | Tell the author that this fails on your system:
5:03:23 AM web.1 | npm ERR! node index.js
5:03:23 AM web.1 | npm ERR!
5:03:23 AM web.1 | You can get information on how to open an issue for this project with:
5:03:23 AM web.1 | npm ERR! npm bugs sakamichi-akb-chords
5:03:23 AM web.1 | npm ERR! Or if that isn't available, you can get their info via:
5:03:23 AM web.1 | npm
5:03:23 AM web.1 | ERR! npm owner ls sakamichi-akb-chords
5:03:23 AM web.1 | npm ERR! There is likely additional logging output above.
5:03:23 AM web.1 | npm
5:03:23 AM web.1 | ERR! Please include the following file with any support request:
5:03:23 AM web.1 | npm ERR! /home/emil/Documents/Chord PWA/npm-debug.log
[DONE] Killing all processes with signal SIGINT
5:03:23 AM web.1 Exited with exit code null
这是我的index.js
const path = require ('path')
const PORT = process.env.PORT || 5000
const express = require('express')
if ('serviceWorker' in navigator) {
window.addEventListener('load', function() {
navigator.serviceWorker.register('/sw.js').then(function(registration) {
// Registration was successful
console.log('ServiceWorker registration successful with scope: ', registration.scope);
}, function(err) {
// registration failed :(
console.log('ServiceWorker registration failed: ', err);
});
});
}
express()
.use(express.static(path.join(__dirname, 'public')))
.set('views', path.join(__dirname, 'views'))
.set('view engine', 'ejs')
.get('/', (req, res) => res.render('pages/home'))
.listen(PORT, () => console.log(`Listening on ${ PORT }`))
有什么帮助吗?请简单解释一下。谢谢!
1条答案
按热度按时间mzaanser1#
React服务器端呈现(& S)
如果您正在进行服务器端渲染,则需要在客户端运行的函数中调用navigator。
例如,我想通过React.js运行一个JS函数,该函数确定设备是否为移动的设备,这样我就可以执行如下一次性内联样式:
现在这个函数使用了navigator,所以我不能只调用
fontSize: isMob() ?...
,而是在生命周期方法ComponentDidMount()
中调用它,因为它在客户端运行,将它设置为state,然后使用this.state.isMob
。这里需要注意的是,页面加载后会出现闪烁,因为它需要重新呈现。所以如果它对任何“折叠以上”的组件产生影响,那么你会很伤心。
也许不是一个很好的例子(使用CSS代替),但仍然是一个例子。