I want to make a module to be accessible globally (window). Just like jQuery. How can I do that in webpack?
If I have some file in src folder then how can I access globally.
Making a JavaScript module global doesn't require you to change your Webpack setup. Instead, you can simply create the src file as a JavaScript Module.
The linked MDN page gives detailed information about how this works and how to do it. As you can see, the JavaScript Modules system is supported by all modern browsers, which is why there is no need for any Webpack setup just to use a module.
EDIT given the nature of my reply, I have not answered the question directly. If you still wish to use Webpack, the Webpack documentation gives information on making things global. Such as here. Please note, you will see on that page that they actually try to dissuade you from making things global. Depending on your case, there may be relevant warnings here against this approach.
Related
I am used to simply using process.cwd() directly inside of node applications, however, I have recently read the node docs and saw that it recommends importing it from node:process.
So what is the difference from just calling it directly?
process.cwd()
vs importing it and calling it:
import {cwd} from 'node:process'
cwd()
I am currently building a CLI application in case that makes a difference.
Is there a difference?
Which one should I be using?
importing it from node:process guarentees that you get the built-in process module, not some global that some other code in the project has configured or overridden.
This may be done for safety reasons or just for robustness reasons so other modules in the project can't hack on a global process object before you get to use it.
It also may not normally be needed, but is considered good project hygiene as it deters certain types of hacking.
While trying to use this library
I initially got error ReferenceError: require is not defined.
To solve it, I added required library. This now started with another error as Module name "crypto" has not been loaded yet for context
FOR LEG PULLERS: This is not a duplicate question, As all the questions are either poorly answered or not answered.
I have done my research, EG: this does not tells where to try it.
this is unanswered. this does not tells where do I get those paths like 'path/to/filesize' and all other paths anyways if I get then also is useless in my context. this defines a module of its own, I need a predefined "crypto" module. The default google library is not doing the job.
From my guessing, you are under browser environment instead of developing a NodeJS app.
This crypto you refer to is actually for back-end (NodeJS), provided as NodeJS API, and also, the require keyword, is a NodeJS one.
And from my knowledge, there is no crypto in the default browser environment, neither is there a require. For most cases, there is a REQUIRE.JS and Browserify that let you use this type of require statement, but for your case, I suggest not to use them.
For crypto used in browser environment, I would suggest something using some third-party libraries, like crypto-js, and you without browserify or bower, you should pay special attention to its Usage without RequireJS section.
I just wrote a module ( https://github.com/mercmobily/simpleDeclare ) and made it available as a Node module via NPM. It follows CommonJS.
I would like to make it also available to people using Bower, and AMD-like loader, and a straight include using the browser.
What's the current pattern to make this happen? Or, is it even possible? I remember seeing a few modules that did it, but cannot find them and am only finding outdated and not-so-definite information (but I suspect I am looking for the wrong thing).
So I've been building a single page web app for a while now and I've been writing all my code in an extremely modular approach. I've been using the javascript module pattern for all modules and my main API uses the revealing module pattern to expose a small API for plugins and other modules.
So even if I've been writing my code like this someone mentioned I should be using require.js as it gives a better modular approach.
I decided that require.js doesn't really make it more modular so my next thought was how require.js separates out dependencies. Require.js forces you to name dependencies in each module file. But this to me seems to be a task I have to do for every module and I have a lot of modules. At the moment all my files are concatenated into a single javascript file in my grunt build process so really all my files are loaded at the start. I need most of my modules loaded at the start so it made sense to do this.
So my question is... Should I use require.js even though my code is modular and all my files are concatenated together and loaded at the start? Do i need to worry about dependencies or loading order? Any help/advise or previous experience when dealing with this situation would really help. Thanks
Have you had annoyances putting <script> tags in the correct order to handle dependencies right?
Having a requirejs config file where you declare the third-party code and your own code dependency tree is a much more organised approach than declaring <script> tags by yourself.
When you are testing your app in dev environment, wouldn't be helpful to have all those modules in separated files that are easier to debug instead of all of them concatenated?
With requirejs you can switch between optimised/concatenated/minified code used in production environment and a list of independent files representing each module in the development environment.
Are you creating a global variable for each module in your app?
Requirejs avoids creating a global variable for each module so your global scope doesn't get cluttered.
It's usually a good practice to follow conventions in the way you declare modules. Requirejs implements AMD specification that is a well thought way of loading modules in client javascript.
http://requirejs.org/docs/whyamd.html
It's way easier to follow conventions if they're already implemented in a mature framework. And sometimes we don't notice but between apps we do the same thing differently and that affects in the maintenance phase.
Take a look at the requirejs optimizer. Look all the options it give you. It allows you to exclude files, to change versions of a given module, to change the minification tool, to integrate the optimization process with other tools like grunt or bower, etc.
http://requirejs.org/docs/optimization.html
If you don't need any of this, then just continue doing it in your way.
I have many JS files. Some of them depend on each other. Many of them depend on jQuery.
I need tool that can accept one file as parameter, fetch all its dependencies transitively and compile them into one file in proper order (based on dependencies)
Dependency information not always available inside files itself, so it would be nice to have it somewhere outside (xml file? folder structure?)
I've heard about Yahoo JS compiler, closure and so on, but I am not sure they do what I need.
Look: I have module "CustomerPage". It sould include "validation.js" and "gui.js". Both require jquery.js. And "gui.js" also requires "myFunctions.js".
I want some ant task or some script that would generate "CustomerPage.js" as result of all that files.
Tool should check dependency order, prevent double including and so on.
My project could have around 500 js files, how could I live with out of this tool?
People says "use GWT", but I need plain JS.
You might want to look at one of the AMD-style module loaders, such as RequireJS. Some of these can do what you want for precompiling, and can run in a development mode which makes it easier to debug by including all the files directly.