编程 使用page-skeleton-webpack-plugin生成骨架屏提示Cannot read property 'newPage' of null"解决办法

2024-11-17 05:02:46 +0800 CST views 4025

  App running at:
  - Local:   http://localhost:8080
  - Network: http://192.168.1.9:8080

[19:58:50] ‼ ｢pswp｣: Error: ENOENT: no such file or directory, open 'H:\php_web\phpStudy\WWW\1\qnvue\pay\shell\index.html'
[19:59:55] i ｢pswp｣: begin to generator skeleton screen
[19:59:55] ‼ ｢pswp｣:  TypeError: Cannot read property 'newPage' of null
    at Skeleton.newPage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:34:37)
    at Skeleton.genHtml (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:64:29)
    at H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:244:19
    at Array.map (<anonymous>)
    at Skeleton.renderRoutes (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:242:31)
    at SockJSConnection.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\server.js:144:57)
    at SockJSConnection.emit (events.js:210:5)
    at Session.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\transport.js:246:25)
    at WebSocketReceiver.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:104:39)
    at WebSocket.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:70:24)
    at WebSocket.emit (events.js:210:5)
    at WebSocket.dispatchEvent (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api\event_target.js:24:10)
    at WebSocket._receiveMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:142:10)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:34:49)
    at Hybi.emit (events.js:215:7)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\websocket-driver\lib\websocket\driver\hybi.js:460:14)
[19:59:56] i ｢pswp｣: begin to generator skeleton screen
[19:59:56] ‼ ｢pswp｣:  TypeError: Cannot read property 'newPage' of null
    at Skeleton.newPage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:34:37)
    at Skeleton.genHtml (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:64:29)
    at H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:244:19
    at Array.map (<anonymous>)
    at Skeleton.renderRoutes (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:242:31)
    at SockJSConnection.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\server.js:144:57)
    at SockJSConnection.emit (events.js:210:5)
    at Session.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\transport.js:246:25)
    at WebSocketReceiver.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:104:39)
    at WebSocket.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:70:24)
    at WebSocket.emit (events.js:210:5)
    at WebSocket.dispatchEvent (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api\event_target.js:24:10)
    at WebSocket._receiveMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:142:10)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:34:49)
    at Hybi.emit (events.js:215:7)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\websocket-driver\lib\websocket\driver\hybi.js:460:14)
[20:00:01] i ｢pswp｣: begin to generator skeleton screen
[20:00:01] ‼ ｢pswp｣:  TypeError: Cannot read property 'newPage' of null
    at Skeleton.newPage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:34:37)
    at Skeleton.genHtml (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:64:29)
    at H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:244:19
    at Array.map (<anonymous>)
    at Skeleton.renderRoutes (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:242:31)
    at SockJSConnection.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\server.js:144:57)
    at SockJSConnection.emit (events.js:210:5)
    at Session.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\transport.js:246:25)
    at WebSocketReceiver.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:104:39)
    at WebSocket.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:70:24)
    at WebSocket.emit (events.js:210:5)
    at WebSocket.dispatchEvent (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api\event_target.js:24:10)
    at WebSocket._receiveMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:142:10)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:34:49)
    at Hybi.emit (events.js:215:7)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\websocket-driver\lib\websocket\driver\hybi.js:460:14)
[20:04:46] i ｢pswp｣: begin to generator skeleton screen
[20:04:46] ‼ ｢pswp｣:  TypeError: Cannot read property 'newPage' of null
    at Skeleton.newPage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:34:37)
    at Skeleton.genHtml (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:64:29)
    at H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:244:19
    at Array.map (<anonymous>)
    at Skeleton.renderRoutes (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:242:31)
    at SockJSConnection.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\server.js:144:57)
    at SockJSConnection.emit (events.js:210:5)
    at Session.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\transport.js:246:25)
    at WebSocketReceiver.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:104:39)
    at WebSocket.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:70:24)
    at WebSocket.emit (events.js:210:5)
    at WebSocket.dispatchEvent (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api\event_target.js:24:10)
    at WebSocket._receiveMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:142:10)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:34:49)
    at Hybi.emit (events.js:215:7)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\websocket-driver\lib\websocket\driver\hybi.js:460:14)
[20:04:47] i ｢pswp｣: begin to generator skeleton screen
[20:04:47] ‼ ｢pswp｣:  TypeError: Cannot read property 'newPage' of null
    at Skeleton.newPage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:34:37)
    at Skeleton.genHtml (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:64:29)
    at H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:244:19
    at Array.map (<anonymous>)
    at Skeleton.renderRoutes (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:242:31)
    at SockJSConnection.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\server.js:144:57)
    at SockJSConnection.emit (events.js:210:5)
    at Session.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\transport.js:246:25)
    at WebSocketReceiver.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:104:39)
    at WebSocket.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:70:24)
    at WebSocket.emit (events.js:210:5)
    at WebSocket.dispatchEvent (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api\event_target.js:24:10)
    at WebSocket._receiveMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:142:10)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:34:49)
    at Hybi.emit (events.js:215:7)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\websocket-driver\lib\websocket\driver\hybi.js:460:14)
[20:05:45] i ｢pswp｣: begin to generator skeleton screen
[20:05:45] ‼ ｢pswp｣:  TypeError: Cannot read property 'newPage' of null
    at Skeleton.newPage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:34:37)
    at Skeleton.genHtml (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:64:29)
    at H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:244:19
    at Array.map (<anonymous>)
    at Skeleton.renderRoutes (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:242:31)
    at SockJSConnection.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\server.js:144:57)
    at SockJSConnection.emit (events.js:210:5)
    at Session.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\transport.js:246:25)
    at WebSocketReceiver.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:104:39)
    at WebSocket.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:70:24)
    at WebSocket.emit (events.js:210:5)
    at WebSocket.dispatchEvent (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api\event_target.js:24:10)
    at WebSocket._receiveMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:142:10)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:34:49)
    at Hybi.emit (events.js:215:7)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\websocket-driver\lib\websocket\driver\hybi.js:460:14)
[20:07:51] i ｢pswp｣: begin to generator skeleton screen
[20:07:51] ‼ ｢pswp｣:  TypeError: Cannot read property 'newPage' of null
    at Skeleton.newPage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:34:37)
    at Skeleton.genHtml (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:64:29)
    at H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:244:19
    at Array.map (<anonymous>)
    at Skeleton.renderRoutes (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\skeleton.js:242:31)
    at SockJSConnection.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\page-skeleton-webpack-plugin\src\server.js:144:57)
    at SockJSConnection.emit (events.js:210:5)
    at Session.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\transport.js:246:25)
    at WebSocketReceiver.didMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:104:39)
    at WebSocket.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\sockjs\lib\trans-websocket.js:70:24)
    at WebSocket.emit (events.js:210:5)
    at WebSocket.dispatchEvent (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api\event_target.js:24:10)
    at WebSocket._receiveMessage (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:142:10)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\faye-websocket\lib\faye\websocket\api.js:34:49)
    at Hybi.emit (events.js:215:7)
    at Hybi.<anonymous> (H:\php_web\phpStudy\WWW\1\qnvue\pay\node_modules\websocket-driver\lib\websocket\driver\hybi.js:460:14)

#解决办法

npm install puppeteer 的时候会默认下载一个Chromium 没必要下载。直接使用本地就可以

//node_modules\page-skeleton-webpack-plugin\src\skeleton.js
//26行
this.browser = await puppeteer.launch({ headless })
//改成
this.browser = await puppeteer.launch({ headless, executablePath: 'C:/Program Files (x86)/Google/Chrome/Application/chrome.exe' })

#看下日志 问题解决

 -> "[PSG] connected"
index.bundle.js:1 ? -> "[PSG] begin to generator skeleton screen"
index.bundle.js:1 ? -> "[PSG] generator skeleton screen successfully"
index.bundle.js:1 ? -> "[PSG] Browser open another page..."
index.bundle.js:1 ? -> "[PSG] Browser open another page..."
复制全文 生成海报 编程 错误处理 Web开发

推荐文章

5款拖拽式Python GUI生成器助你快速打造炫酷界面
2024-11-19 09:39:04 +0800 CST
浏览器悄悄上线了这个 API，让跨标签页通信变得轻而易举
2025-08-15 12:35:34 +0800 CST
一键式操作以简化Docker的日常管理
2024-11-19 07:01:44 +0800 CST
Warp：Rust Web开发的急速列车 - 高性能与优雅并存的新一代框架
2024-11-19 10:05:16 +0800 CST
Nginx负载均衡详解
2024-11-17 07:43:48 +0800 CST
Mock.js是一个基于JavaScript的数据模拟库，允许开发者在后端接口未就绪时模拟CRUD操作
2024-11-18 11:25:16 +0800 CST
Go语言中的`bndr/gotabulate`库，帮助用户轻松实现美观的表格数据打印
2024-11-18 22:01:41 +0800 CST
使用 Gin 和 OpenAI 实现实时聊天：后端代码与前端集成
2024-11-19 01:23:58 +0800 CST
PHP 的生成器，用过的都说好！
2024-11-18 04:43:02 +0800 CST
前端加密的重要性及两种常用的加密库：Crypto-JS和JSEncrypt
2025-05-05 20:25:34 +0800 CST
import 导入过的模块需要再次执行怎么办？
2024-11-18 11:04:52 +0800 CST
五个有趣且实用的Python实例
2024-11-19 07:32:35 +0800 CST
如何在Rust中使用UUID？
2024-11-19 06:10:59 +0800 CST
商城APP开发费用解析：如何判断报价是否合理？
2024-11-19 01:02:48 +0800 CST
mysql关于在使用中的解决方法
2024-11-18 10:18:16 +0800 CST
gosort 包实现了对列表的排序以及在有序列表上的二分查找
2024-11-19 04:46:04 +0800 CST
Vue3中如何处理SEO优化？
2024-11-17 08:01:47 +0800 CST
Python中的self-messages库轻松处理和发送消息
2024-11-19 00:17:03 +0800 CST
btp-devops是一个在Python中非常有用的库，旨在简化开发运维过程
2024-11-19 07:50:26 +0800 CST
MySQL设置和开启慢查询
2024-11-19 03:09:43 +0800 CST
Nginx服务器版本号泄露的安全隐患，强调了攻击者如何利用已知漏洞进行攻击
2024-11-19 03:48:34 +0800 CST
不止 WebSocket 可以实现长连接，它也可以：Server-Sent Events（SSE）
2024-11-19 02:59:49 +0800 CST
Vue3中实现虚拟列表，利用虚拟滚动技术来展示大量数据集合，从而提高性能。
2024-11-19 09:42:08 +0800 CST
Vue3的CompositionAPI和setup语法糖构建一个简单的待办事项应用
2024-11-17 04:21:34 +0800 CST
抛弃 `!important`：提升 CSS 优先级的正确姿势
2025-08-15 15:45:38 +0800 CST
Skip是一款为Swift开发者设计的跨平台工具，允许开发者使用一套Swift代码生成iOS和Android的原生应用
2024-11-19 05:18:20 +0800 CST
JS 箭头函数
2024-11-17 19:09:58 +0800 CST
如何在Vue3中实现子组件向父组件传递数据
2024-11-19 09:39:54 +0800 CST
一个轻量级的JavaScript库，专为浏览器端高效图片压缩设计，支持JPEG、PNG、WEBP等格式
2025-05-05 19:27:57 +0800 CST
使用Rust进行跨平台GUI开发
2024-11-18 20:51:20 +0800 CST
一个好用的Vue3下拉框组件省市区联动的操作
2024-11-19 07:37:53 +0800 CST
Go应用中使用MongoDB客户端库mongo-driver
2024-11-18 21:53:37 +0800 CST
为什么vue:deep、/deep/、>>>样式能穿透到子组件
2024-11-19 05:20:55 +0800 CST
Vue中的指令是什么？如何使用指令？
2024-11-17 04:30:33 +0800 CST
Pydantic是一个用于数据验证和设置管理的Python库
2024-11-18 22:22:27 +0800 CST
彻底删除 Git 中的较大文件（包括历史提交记录）
2024-11-18 06:30:20 +0800 CST
Docker搭建一款跨平台的个人笔记服务
2024-11-19 08:51:04 +0800 CST
magic-html是一个基于Python的高效HTML解析工具
2024-11-18 12:15:14 +0800 CST
优化 CSS 以获得更好性能和可维护性的 10 个基本技巧
2024-11-19 00:04:49 +0800 CST
一个数字时钟的HTML
2024-11-19 07:46:53 +0800 CST
PHP 代码功能与使用说明
2024-11-18 23:08:44 +0800 CST
告别Pr/AE！用FFCreator这个Node.js神器，编程式自动化批量生成视频
2025-09-01 06:59:10 +0800 CST
实时监控网页变动的利器！- ChangeDetection
2024-11-19 10:07:56 +0800 CST
Flet 构建跨平台应用的 Python 框架
2025-03-21 08:40:53 +0800 CST
Goja，一个在Golang中嵌入JavaScript的运行时库
2024-11-19 03:33:49 +0800 CST
Golang实现的交互Shell
2024-11-19 04:05:20 +0800 CST
Vue3 vue-office 插件实现 Word 预览
2024-11-19 02:19:34 +0800 CST
如何在Vue项目中生成二维码和条形码
2024-11-19 08:05:12 +0800 CST
csvkit是一个功能强大的Python库，专门用于处理CSV文件
2024-11-19 04:53:20 +0800 CST
CentOS 镜像源配置
2024-11-18 11:28:06 +0800 CST
程序员茄子在线接单