⚠️ This writing is a work in progress.⚠️
Packages and Modules
The following content was pulled from the link in the section header.
NPMJS website is very clear on these two things:
A package is a file or directory that is described by a package.json file. A package must contain a package.json file in order to be published to the npm registry. A package is any of the following:
- a) A folder containing a program described by a package.json file.
- b) A gzipped tarball containing (a).
- c) A URL that resolves to (b).
- d) A git url that, when cloned, results in (a).
A module is any file or directory in the node_modules directory that can be loaded by the Node.js require() function.
To be loaded by the Node.js require() function, a module must be one of the following:
A folder with a package.json file containing
- a "main" field.
- A folder with an index.js file in it.
- A JavaScript file.
In the context of a Node program, the module is also the thing that was loaded from a file. For example, in the following program: - https://npmjs.com
Note: Since modules are not required to have a package.json file, not all modules are packages. Only modules that have a package.json file are also packages.
As well its good to know that:
<!-- This will not execute, as it fails a CORS check --> <script type="module" src="https://….now.sh/no-cors"></script> <!-- This will not execute, as one of its imports fails a CORS check --> <script type="module"> import 'https://….now.sh/no-cors'; </script> <!-- This will execute as it passes CORS checks --> <script type="module" src="https://….now.sh/cors"></script>
and that
Node modules do not add to the global scope without explicetly being pointed to. I.E. 'window.variable = hahaha'
Example: Create Node.js Modules
The following content was pulled from the link in the section header
- Create a package.json file
- create a package.json file : 'npm init'
- required fields: name, version, 'main' fields
- The default name is index.js.
- Create the file that will be loaded when your module is required by another application
Once your package.json file is created, create the file that will be loaded when your module is required. The default name for this file is index.js.
In the file, add a function as a property of the exports object. This will make the function available to other code:
'''exports.printMsg = function() { console.log("This is a message from the demo package"); }'''
- Test your module
- Publish: "npm publish --access public"
- mkdir test-directory
- cd ../path/to/test-directory
- npm install
- create a test.js file which requires your module and calls your module as a method.
"var req = require('request')"
- On the command line, run node test.js. The message sent to the console.log should appear.
Example: Publish to NPM
The following content was pulled from the link in the section header
Heres an article with more instructions and best practices.
Package.json to use Git Gists
Git URLs used for npm packages can be formatted in the following ways:
- git://github.com/user/project.git#commit-ish
- git+ssh://user@hostname:project.git#commit-ish
- git+http://user@hostname/project/blah.git#commit-ish
- git+https://user@hostname/project/blah.git#commit-ish
The commit-ish can be any tag, sha, or branch that can be supplied as an argument to git checkout. The default commit-ish is master.
Python Github Gist Javascript
Save a Github Gist using Python.
ObservableHQ Modules
You can use ObservableHQ to create test and export JS Modules
Here are some more notes on it:
Introduction Require Embedding HTML
And and embedding example:
Modules in the browser
Safari, Chrome, Firefox and Edge all support the ES6 Modules import syntax.
If you want to load ES modules on a different domain, you’ll need to enable CORS.
Some more on that:
For information on using module, see our JavaScript modules guide. Unlike classic scripts, module scripts require the use of the CORS protocol for cross-origin fetching - javascript.info
Scripts without async , defer or type="module" attributes, as well as inline scripts, are fetched and executed immediately, before the browser continues to parse the page.
The script should be served with the text/javascript MIME type, but browsers are lenient and only block them if the script is served with an image type (image/); a video type (video/); an audio (audio/*) type; or text/csv. If the script is blocked, an error is sent to the element, if not a load event is sent. - script