I have an electron project that is split into multiple windows, with several javascript files for each window. My problem is that there is no recognition that these files are linked by VS Code. For Example:
A variable declared in "mainwindow/constants.js" and then used in "mainwindow/socketFunction.js", will show up as greyed out and is declared but the value is never read. Likewise, if a function is declared in a certain file and used in another, ctrl-clicking the function name to go to function declaration does not work.
Is there any way to get VS code to recognize the structure of the files, ie: that variables declared in one file are the same that are being used in another.
EDIT: my file structure looks like this if it helps
Related
I'm using bootstrap and I have a file 'global.ts' in my 'src/app' containing a variable 'server_url' which is used in my whole application.
There is a way to access the value of this variable inside a plugin js file located in a folder 'src/assets/plugin/js'?
I found a lot of suggestions about the opposite i.e. accessing a variable declared inside a js file from a ts file, but I can't really find information about this.
As I'm setting up ESLint for the first time, I'm a little confused about how it deals with globals.
I've got 40+ js files, (one js file per page in a CRM like application), and some of them are quite long, like 3-4k+ lines. And these JS files share most of their functions in a common file I've named "core.js", which gets included on all pages.
Looking at https://eslint.org/docs/user-guide/configuring#specifying-globals, it looks like it wants me to specify every single function and variable that's used from core.js in my current file, order.js. That just wouldn't be an option, since there's bound to be 50+ global functions/variables that I use, and that list is very subject to change.
Is there not a way to tell ESLint that everything in core.js is global to this file? And on the flip side, it's also telling me that the functions in my core.js aren't ever being used.
I'm trying to experiment with [this library](https://code.google.com/p/autotags/ in meteor).
First, when I tried to install all the individual javascript files to client/compatibility folder, I get an error message when calling AUTOTAGS from the constants js file:
AUTOTAGS = { ... } // autotags-js-core.js
AUTOTAGS.TAG_CONSTANTS = [ 'news','research','favourite' ]; // autotags-js-constants.js
It kept saying that AUTOTAGS was undefined. I deduced from reading about global scope that any external library with VAR that you want to have global scope, put it under compatibility.
If that's correct, then why isnt the scope global when putting all individual files under lib/external? AUTOTAGS = {..} without var means its available to entire application right?
Instead, I got the scope to work by combining all the javascript files in one single js file under lib/external. I thought I understood, but it gets worse.
Within a single js file - any function that begins with a closure is local to that FILE, and not global scope, whilst any function assigned to variable name makes it a global variable?
function(something() { ... } ) // closure, local
generateTags = function() { ... } // global scope?
var generateTags = function() { .... } // is this local or global?
If the var generateTags function is local, then putting it under client/compatibility will make it global? Lastly! - I get the vague notion that I should define global variables under lib/environment.js from here - https://github.com/oortcloud/unofficial-meteor-faq#where-should-i-put-my-files, is that true?
There are actually two questions here. One is about how the scope works in javascript, the other about integrating the autotags library into a meteor project. Since the answer for the first one should be relatively easy to find somewhere else, I'll only try to answer the second question.
The reason you are getting this "undefined" error is not a scope problem but it is somehow related to the order in which the files are loaded into your meteor app. Namely, autotags-js-constants.js comes before autotag-js-core.js because constants precedes core in the alphabetic ordering. In consequence, the AUTOTAGS variable is not defined at the point when the autotags-js-constants.js file is being parsed.
One simple way to overcome this issue is to rename your files, so as to enforce the right loading order. Another way is to use a tool that will enable you to define dependencies between files. If you are interested please take a look at require project, which is basically a lightweight and meteor friendly implementation of the core requirejs features.
However, probably the best solution is to create a custom smart package. It would allow you to explicitly define the order in which the files should be loaded. Just take a look on some existing smart packages to get the idea on how this should be implemented. I would also recommend using meteorite to manage your custom smart packages.
Not really sure how to ask this, but I'm just looking for some insight/info.
If I'm including multiple JavaScript files in my app, how does the page/app see all the JS code. Does all the JS in all files become one-big JS file
If one JS file has a variable foo=true; and another JS file has foo=false, what is the scope of foo? Is it local to the script it is in or does it become seen in 'all' the js code?
Thanks for any insights.
Yes, for most purposes it's just like if there were only one file, built by concatenating all the files in the order of imports.
The differences :
"use strict"; (supposing it's present) is only valid per file
it's much slower for the browser to fetch 10 small files than a big one, which is why js developers building big applications usually concatenate (and often minify) all the files for production
The only thing the scripts share is the global scope; the separate parts don’t become one big file.
For example, you can’t do this:
<script type="text/javascript">
function hello() {
</script>
<script type="text/javascript">
}
</script>
And a 'use strict' in one <script> wouldn’t apply strict mode across all of them.
If you define in one file, without using var:
foo = true;
It will be a global variable, and it will be accessible by your second JS file when it does foo = false
All your scripts will share the same global namespace if they are defined in plainly on the page. To create a local scope for your variable, you'd have to wrap it in a function.
See the explanation provided in this question: What is the scope of variables in JavaScript?
To easily handle multiple JavaScript files and keeping the global scope minimal, while allowing the different scripts to share information, I recommend you try RequireJS (http://requirejs.org/), it is a JavaScript file and module loader. It will handle any file dependancies you may have and it'll load them asynchronously. It will also make it easy for you to pass variables amongst the different modules/files without having to expose them to the global scope.
There are other file/module loaders too. See: http://www.netmagazine.com/features/essential-javascript-top-five-script-loaders
I have a log.js file(it contains log function along with some properties) for debugging purpose.
I have two other js file which are the controlling various behavior of the web application.
Now I need to include the log function considering not to repeat the debug function in both the js file and just calling the file name.
How do I do it?
The idea is to make my code clean and separate them in other files to limit the size of a single js file.
Include all .js-files in the html page. Include log.js first.
Call the functions all you want.
All functions in all files are included in the source and are "written on the page", any functions can be accessed from anywhere within the HTML as they all become essentially one document. Make sure you do not have duplicate functions as this could cause an issue