Incomplete documentation Vue DevTools

[vallemar]

From step 4 the documentation is not clear.
Step 4: run vue-devtools.
What do I have to do with the screen that comes out? Do I close it, leave it open? Is it debugged on that screen? Where do I paste the <script> that appears?
These are basic questions for a person who has just started with nativescript.

Step 5: Rebuild and run your app.
Do I have to do this on a console other than the previous one?
Where is this debug?

I was very excited to start with nativescript-vue but this is taking away my desire. Also I only have errors when executing in step 5.

A review of the documentation of this step is important. This is one of the key points for development.

Thank you!

[rigor789]

Hey @vallemar!

Step 4: There's nothing to do when the devtools windows pops up. The instruction it prints are irrelevant for a nativescript app, but that part comes from VueDevtools and not us. Once a connection is established it should just switch to the right devtools window automatically.

Step 5: Yes you need a separate session (new tab, or window depending on your terminal), otherwise you'd close the devtools window that you previously opened.

Where is this debug?

I am not quite sure what you are asking?

I only have errors when executing in step 5

Please share your errors so we can help you. Preferably on Slack or Discord

A review of the documentation of this step is important.

Sure, would you mind suggesting what we could change to make it clearer? There's nothing more to running the devtools than documented - perhaps we could change up the wording a little, or add notes about ignoring the screen that VueDevtools shows when started?

[vallemar]

Good,

The first thank you very much for answering so fast!
I apologize for my level of English :(

Sure, would you mind suggesting what we could change to make it clearer? There's nothing more to running the devtools than documented - perhaps we could change up the wording a little, or add notes about ignoring the screen that VueDevtools shows when started?

My suggestions are as follows:
Step 4

• Report on the devtool (electron) screen should be listening in the background.
• Report that the information on this screen is irrelevant for normal users. (<script>...</script>)

Step 5

• Inform that there must be another tab or cmd window to run the application. (Although it seems obvious it is good to clarify it for new people in cli tool).

I still don't understand it, I have an application running on an emulator, the vue-devtool window with instructions that as it says are unnecessary for me and I don't know how to see anything from the vue-devtool tool. I show a screenshot of everything ... I don't know where I got lost

I am not quite sure what you are asking?

Having these 3 tools running, I still don't know how to access devtool

If we continue with the clarification I can give better advice on how it is used.

Please share your errors so we can help you. Preferably on Slack or Discord

It was something that had Android studio busy. Restart cache and it worked! Thank you for notifying me of the error channel, I will save it!

Thank you!

[rigor789]

I think the problem is that you are on android API 28+ where clear text traffic is disabled by default. That means that the devtools is not able to connect. To fix that, you need to add

<application
 <!-- ... -->
 android:usesCleartextTraffic="true"
 <!-- ... -->
</application>

in your AndroidManifest.xml inside App_Resources.

Thanks for the feedback, I will update the docs to mention this too (took me a while to figure out that's most likely the problem).

Edit: I have updated the docs page with a Troubleshooting section, and fixed wording based on your feedback.

[vallemar]

Ohhhh!! This is music to my ears!

Now I will start with the development!
The documentation update seems good to me. Now it is clearer. I will use the documentation a lot, with what I continue to see I will comment.

I think this topic is closed! Keep it up!

Thank you.