How to effectively code in javascript?

Question

JavaScript

Hello!
experienced and efficient javascript programmers, please share your experience.
I have code defined in several javascript modules:
there is clientApi.js, which defines functions that use axios to interact with the server,
there is store,js, which defines mutations, actions, and vuex state, and which calls functions from clientApi.js,
there are vue components that have their own methods that call vuex actions.
when the code is running, a chain of calls is obtained: component -> store.js -> clientApi.js.
each module imports the code of the used module.
How can I separately pull the methods of each module in the google chrome console? for some reason they turn out to be undefined for me (in the console), although the code works properly and if you stick debugger; in each individual function, then in this interrupt I can see all the variables.
in general, the problem is this: until you write the code for the entire chain, it is impossible to check and debug each individual function, and this approach turns out to be long and unproductive.
how do experienced, efficient javascript (front-end) programmers conduct development?
what should I do to program the client effectively? do you need to get used to (train) to quickly make chains of code or is there some way to develop in javascript in pieces: wrote, debugged (still unit-test done)?
PS I have been programming in c# for a long time and I use the following approach: I develop functionality, write unit tests, run unit tests in debugging many times during development, see how the code works, make changes, etc. then I move on to another component, and so on, then I combine the components, write integration tests, run, check and it turns out that every piece and the system as a whole works and remains stable. is it possible (and if possible, how) to use the same approach in javascript?

Answer 1

In the console - in any way, if you do not contrive. the code, after the work of the collectors, is completely encapsulated.
You can, during development, add these methods to the window object, if you really want to pull these functions manually from the console (then do not forget to delete)
file - development_test.js

import * as api from './api/clientApi.js';
window.api = api;

Just import this test file into the root of the project, you get the opportunity to pull window.api[api_method] from the console.
Well, in general - it is most convenient to write unit tests on parts of the system

Answer 2

I also develop in a modular way, but I write in pure JS. I use either the includeHTML function for
recursive "gluing" of HTML/JS/CSS . Or the same, but with JS:
includeHTML('js/module123.js');

Answer 3

there is, it seems, the ability to run js functions in the nodejs environment, and somehow attach a debugger to this matter, apparently I will dig in this direction, if you are familiar with such approaches, please share.