Closed funkyLover closed 4 years ago
@willworks @HiuYanChong
devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&ws=127.0.0.1:9999/__ws_proxy__ chrome 可以调试
按 F5 调试前确保项目中存在 .vscode/launch.json 文件
{
"version": "1.0.0",
"configurations": [
{
"name": "Launch Egg Vue",
"type": "node",
"request": "launch",
"cwd": "${workspaceRoot}",
"runtimeExecutable": "npm",
"windows": { "runtimeExecutable": "npm.cmd" },
"runtimeArgs": [ "run", "debug" ],
"console": "integratedTerminal",
"protocol": "auto",
"restart": true,
"port": 9229,
"autoAttachChildProcesses": true
}
]
}
调试时,请按F5 按钮,然后会出现如下效果,表示可调试
@hubcarl 太棒了有vscode的配置指引👍👍👍
但是前端页面卡住的问题还是存在,用debug模式运行时没办法打开前端页面
试了一下请求 http://127.0.0.1:7001
,按照路由规则应该是会到 AdminController#home 中去才对,但 controller 里面的断点没有响应, 前端展示的依然是 webpack正在努力编译中
然后关掉 debug, 在重新启动之后,看 vscode 界面感觉所有的断点都失效了
目前定位到这里
https://github.com/easy-team/egg-webpack/blob/master/lib/mult-process-server.js#L33
这里是会计算编译数量?但是dev
和debug
模式运行最终的 compileDoneCount
数量不一致
这里只有state
为ture时才会发送一个webpack构建状态更新的消息,而debug模式运行时这里的state
为false
奇怪的是当我把这里改过来之后,还是返回的那个webpack正在努力构建中..
的loading页面,不知道为啥
还烦请帮忙看下
@funkyLover 我这边没办法重现,你这边既然找到原因了,可以继续找出问题原因,然后可以提个 PR
@funkyLover 是否显示 loading 的代码在这里:https://github.com/easy-team/egg-webpack/blob/master/app.js
目前定位到的只是构建结果的位置,离搞清楚整块逻辑还有很远的距离
居然不能重现吗,我这边是用mac机的,不确定是不是平台兼容?
下面是我的环境信息
Environment Info:
System:
OS: macOS Mojave 10.14.6
CPU: (8) x64 Intel(R) Core(TM) i7-7700K CPU @ 4.20GHz
Binaries:
Node: 10.16.0 - /usr/local/bin/node
Yarn: 1.7.0 - /usr/local/bin/yarn
npm: 6.9.0 - /usr/local/bin/npm
Browsers:
Chrome: 79.0.3945.117
Firefox: Not Found
Safari: 13.0.2
npmPackages:
@vue/component-compiler-utils: 3.0.2
babel-helper-vue-jsx-merge-props: 2.0.3
easywebpack-vue: ^4.2.1 => 4.5.0
egg-view-vue-ssr: ^3.0.5 => 3.3.1
egg-webpack-vue: ^2.0.0 => 2.0.2
typescript: ^3.0.0 => 3.7.2
vue: ^2.5.0 => 2.6.10
vue-class-component: 6.3.2
vue-entry-loader: 1.1.3
vue-eslint-parser: 2.0.3
vue-hot-reload-api: 2.3.4
vue-html-loader: 1.2.4
vue-loader: 15.7.2
vue-property-decorator: ^7.2.0 => 7.3.0
vue-router: ^3.0.1 => 3.1.3
vue-server-renderer: 2.6.10
vue-style-loader: 4.1.2
vue-template-compiler: 2.6.10
vue-template-es2015-compiler: 1.9.1
vuex: ^3.0.1 => 3.1.2
vuex-class: ^0.3.1 => 0.3.2
vuex-router-sync: ^5.0.0 => 5.0.0
@funkyLover 可以试试显示指定 webpack 配置方式,也就是不走 多进程编译模式 https://github.com/easy-team/egg-vue-typescript-boilerplate/blob/master/config/config.local.ts#L27
使用debug模式启动
结果访问对应的应用如下图所示
还有希望可以提供vscode debug的配置例子