Question

大约一周前，nativescript失去了与vue devtool对话的能力。参见this issue on github。运行此repo to reproduce-（您需要将host中的main.js变量更改为计算机的网络地址）。

这是我尝试过的一些事情：

几个不同的网络，包括有线，公共和私人wifi以及移动热点
本地Android模拟器，其主机设置为“本地主机”，并且还排除了主机。
具有最新Android操作系统的物理android设备Samsung S9
从nativescript-vue-devtools包中获取代码，并添加控制台日志记录。在connect_error -> reconnect循环中连接到devtools套接字时，似乎卡住了。不幸的是，connect错误事件的参数为null，因此没有明确的原因导致失败。

这是该项目中的package.json，它们都是使用CLI初始化项目后的默认值：

{
  "name": "nsvue-devtools-test",
  "version": "1.0.0",
  "description": "A native application built with NativeScript-Vue",
  "author": "Will P.",
  "license": "MIT",
  "nativescript": {
    "id": "org.nativescript.application",
    "tns-ios": {
      "version": "5.0.0"
    },
    "tns-android": {
      "version": "5.0.0"
    }
  },
  "dependencies": {
    "vuex": "^3.0.1",
    "@vue/devtools": "5.0.0-beta.3",
    "nativescript-socket.io": "^0.9.0",
    "nativescript-vue-devtools": "^1.0.0",
    "nativescript-toast": "^1.4.6",
    "nativescript-vue": "^2.0.0",
    "tns-core-modules": "^5.0.2"
  },
  "devDependencies": {
    "@babel/core": "^7.0.0",
    "@babel/preset-env": "^7.0.0",
    "babel-loader": "^8.0.2",
    "babel-traverse": "6.26.0",
    "babel-types": "6.26.0",
    "babylon": "6.18.0",
    "clean-webpack-plugin": "^0.1.19",
    "copy-webpack-plugin": "^4.5.2",
    "css-loader": "^1.0.0",
    "lazy": "1.0.11",
    "nativescript-dev-webpack": "next",
    "nativescript-vue-template-compiler": "^2.0.0",
    "nativescript-worker-loader": "~0.9.0",
    "node-sass": "^4.9.2",
    "sass-loader": "^7.1.0",
    "terser-webpack-plugin": "^1.1.0",
    "vue-loader": "^15.2.6",
    "webpack": "^4.16.4",
    "webpack-bundle-analyzer": "~2.13.1",
    "webpack-cli": "^3.1.0"
  }
}

我还尝试了使用最新版本的nativescript toast和vue devtools进行另一个项目，并且结果相同-vue devtools不会从默认屏幕更改。

我能够将termux与nmap一起使用，以从调试设备进行扫描，并查看我的IP /端口是否打开。我还可以建立一个非常基本的网站，添加一个vue实例，并粘贴开发人员工具用户界面中显示的脚本标签，以表明devtools正常运行。

本机脚本：您正在失去用户对这个问题进行本地响应的能力（请参阅上面问题链接中的评论）。 Vue devtools刚刚发布了一个新版本，宣传了更好的本机脚本支持，但我们完全无法尝试！

自从Nativescript的社区搬到这里以来，我真的只是希望引起开发人员的注意，以解决此问题。如果其他人能够提供解决方法或解决此问题的方法，也将不胜感激。

谢谢！

Answer 1

要让我的android模拟器运行NativeScript vue应用程序与Vue Devtools电子应用程序对话，我需要将android设置为允许明文流量

在AndroidManifest.xml中组现有节点上的android:usesCleartextTraffic="true"。例如

<application
        android:name="com.tns.NativeScriptApplication"
        android:allowBackup="true"
        android:icon="@drawable/icon"
        android:label="@string/app_name"
        android:theme="@style/AppTheme"
        android:usesCleartextTraffic="true"
    >

此解决方案来自此评论 https://github.com/nativescript-vue/nativescript-vue-devtools/issues/8#issuecomment-496292399

也可以通过创建或修改network_security_config.xml文件来解决此问题。

我怀疑这是您要提交并在生产中进行的更改，因此我仅在本地开发中使用它。

Answer 2

您能否在package.json中尝试使用此dep：

"nativescript-toasty": "^1.3.0",
"nativescript-socketio": "^3.2.1",
"nativescript-vue-devtools": "github:anthonny/nativescript-vue-devtools#master",

我不使用nativescript-socket.io和nativescript-toast，而是使用nativescript-socketio（不带。）和nativescript-toasty

它不是真正的解决方案，而是更多的解决方法，但如果可以帮助的话；）

Nativescript vue devtools无法连接

2 个答案: