我希望官方的 vue-cli 插件能够在离线模式下开箱即用,但我无法让它工作。
采取的步骤:
我使用官方 pwa 插件使用 @vue/cli@4.0.5 创建了一个项目
我首先通过 npm run build
在本地运行项目来测试这一点,然后使用以下命令提供文件:
这个chrome插件
https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb?utm_source=chrome-app-launcher-info-dialog
网站加载成功
在 Chrome 开发人员工具的“应用程序”选项卡的“服务工作人员”部分中,我单击“离线”复选框。
编辑:此屏幕截图有点过时了。我知道 chrome 需要 https,除非它在本地主机上运行。我可以确认我在本地托管我的网站:http://localhost:8887/
刷新浏览器
注意浏览器控制台中的错误。
未捕获的语法错误:意外的标记“<” list :行:1,列:1,语法错误。
我对 vue-cli pwa 插件的期望是错误的吗?我的印象是默认设置就可以工作。
更奇怪的是……在清除存储并刷新页面之后。运行一次(在线模式)但再次刷新(在线模式)仍然会产生错误!
最佳答案
使用另一种方法在本地托管我的东西工作正常。就我而言,我必须使用 https://www.npmjs.com/package/serve
关于javascript - vue-cli 使用官方 pwa 插件创建的网站无法在离线模式下工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58907415/