We Keep Coding

npm global packages: Reference content files from package

I'm in the process of building an npm package which will be installed globally. Is it possible to have non-code files installed alongside code files that can be referenced from code files?
For example, if my package includes someTextFile.txt and a module.js file (and my package.json includes "bin": {"someCommand":"./module.js"}) can I read the contents of someTextFile.txt into memory in module.js? How would I do that?

The following is an example of a module that loads the contents of a file (string) into the global scope.
core.js : the main module file (entry point of package.json)
//:Understanding: module.exports
module.exports = {
reload:(cb)=>{ console.log("[>] Magick reloading to memory"); ReadSpellBook(cb)}
}
//:Understanding: global object
//the following function is only accesible by the magick module
const ReadSpellBook=(cb)=>{
require('fs').readFile(__dirname+"/spellBook.txt","utf8",(e,theSpells)=>{
if(e){ console.log("[!] The Spell Book is MISSING!\n"); cb(e)}
else{
console.log("[*] Reading Spell Book")
//since we want to make the contents of .txt accesible :
global.SpellBook = theSpells // global.SpellBook is now shared accross all the code (global scope)
cb()//callBack
}
})
}
//·: Initialize :.
console.log("[+] Time for some Magick!")
ReadSpellBook((e)=>e?console.log(e):console.log(SpellBook))
spellBook.txt
ᚠ ᚡ ᚢ ᚣ ᚤ ᚥ ᚦ ᚧ ᚨ ᚩ ᚪ ᚫ ᚬ ᚭ ᚮ ᚯ
ᚰ ᚱ ᚲ ᚳ ᚴ ᚵ ᚶ ᚷ ᚸ ᚹ ᚺ ᚻ ᚼ ᚽ ᚾ ᚿ
ᛀ ᛁ ᛂ ᛃ ᛄ ᛅ ᛆ ᛇ ᛈ ᛉ ᛊ ᛋ ᛌ ᛍ ᛎ ᛏ
ᛐ ᛑ ᛒ ᛓ ᛔ ᛕ ᛖ ᛗ ᛘ ᛙ ᛚ ᛛ ᛜ ᛝ ᛞ ᛟ
ᛠ ᛡ ᛢ ᛣ ᛤ ᛥ ᛦ ᛧ ᛨ ᛩ ᛪ ᛫ ᛬ ᛭ ᛮ ᛯ
If you require it from another piece of code, you will see how it prints to the console and initializes by itself.
If you want to achieve a manual initalization, simply remove the 3 last lines (·: Initialize :.) and use reload() :
const magick = require("core.js")
magick.reload((error)=>{ if(error){throw error}else{
//now you know the SpellBook is loaded
console.log(SpellBook.length)
})

I have built some CLIs which were distributed privately, so I believe I can illuminate a bit here.
Let's say your global modules are installed at a directory called $PATH. When your package will be installed on any machine, it will essentially be extracted at that directory.
When you'll fire up someCommand from any terminal, the module.js will be invoked which was kept at $PATH. If you initially kept the template file in the same directory as your package, then it will be present at that location which is local to module.js.
Assuming you edit the template as a string and then want to write it locally to where the user wished / pwd, you just have to use process.cwd() to get the path to that directory. This totally depends on how you code it out.
In case you want to explicitly include the files only in the npm package, then use files attribute of package.json.
As to particularly answer "how can my code file in the npm package locate the path to the globally installed npm folder in which it is located in a way that is guaranteed to work across OSes and is future proof?", that is very very different from the template thingy you were trying to achieve. Anyway, what you're simply asking here is the global path of npm modules. As a fail safe option, use the path returned by require.main.filename within your code to keep that as a reference.

When you npm publish, it packages everything in the folder, excluding things noted in .npmignore. (If you don't have an .npmignore file, it'll dig into .gitignore. See https://docs.npmjs.com/misc/developers#keeping-files-out-of-your-package) So in short, yes, you can package the text file into your module. Installing the module (locally or globally) will get the text file into place in a way you expect.
How do you find the text file once it's installed? __dirname gives you the path of the current file ... if you ask early enough. See https://nodejs.org/docs/latest/api/globals.html#globals_dirname (If you use __dirname inside a closure, it may be the path of the enclosing function.) For the near-term of "future", this doesn't look like it'll change, and will work as expected in all conditions -- whether the module is installed locally or globally, and whether others depend on the module or it's a direct install.
So let's assume the text file is in the same directory as the currently running script:
var fs = require('fs');
var path = require('path');
var dir = __dirname;
function runIt(cb) {
var fullPath = path.combine(__dirname, 'myfile.txt');
fs.readFile(fullPath, 'utf8' , function (e,content) {
if (e) {
return cb(e);
}
// content now has the contents of the file
cb(content);
}
}
module.exports = runIt;
Sweet!

how to use a javascript module in pug js templates

To make random strings in pug template I want to use random-string javascript module.
First I install it via npm like this :
npm install random-string
Then in pug template I used this :
.site
.title
- var string = randomString({length: 20});
| #{string}
But while compiling files I got this error :
randomString is not a function
How Can I use third party javascript functions in pug js temaplte?

Your pug file won't have scope of randomString unless it is passed in when you call render() in your file that is calling it (such as your controller).
e.g.
this.render("[pugFilename]", {
randomString = require("randomstring") // whatever package name you're using
}
Personally, I prefer doing any non-view stuff outside the view and in the script that is requesting the view to be rendered, where I can.
The syntax in Pug can start to look very messy otherwise and become difficult to follow.
You can switch out the code above with the code in your question and it should work fine, although I'd recommend changing your variable name (or key) to something more meaningful.
e.g
this.render("[pugFilename]", {
randomStr: randomString({ length: 20 })
});

Update for phpStorm File Watcher
Firstly, install pug-cli and random-string locally,
npm install pug-cli random-string --save
Then setup File Watcher,
Original answer
Set and require random-string as a local variable, then you can access it in the templates. For example,
template.pug
.site
.title
- var string = randomString({length: 20});
| #{string}
compile it using pug
const pug = require('pug');
// Compile template.pug, and render a set of data
console.log(pug.renderFile('template.pug', {
randomString: require('random-string')
}));
//-> <div class="site"><div class="title">o0rGsvgEEOHrxj7niivt</div></div>
If you are using pug-cli, install random-string in the same scope of pug-cli, and specify options through a string or a file.
pug -O "{randomString: require('random-string')}" template.pug

Using NPM package in the browser with Browserify

I'm trying to use Browserify so that I can use an npm package in the browser. The package I'm trying to use is this
I have a fcs.js file:
// Use a Node.js core library
var FCS = require('fcs');
// What our module will return when require'd
module.exports = function(FCS) {
return FCS;
};
And an index.js file:
var FCS = require('./fcs.js');
console.log('FCS IS ');
console.log(FCS);
I then ran:
browserify index.js > bundle.js
And created an index.html file:
<html>
<script src="bundle.js"></script>
<script>
var fcs = new FCS();
</script>
</html>
But I end up with the error:
Uncaught ReferenceError: FCS is not defined
Maybe I'm not grasping the concept correctly. How can i use this package in the browser? Thanks.

Don't do this: require('./fcs.js');
Do this: require('./fcs');
When you require something, the extension is implicitly .js. Also make sure that your module, FCS, has an entry point (the default is index.js, but you can change that in the main entry in the package.json).
Also, in your index.html document, you're expecting that FCS is a global object. I haven't seen the internal code of FCS, but it will only be globally available if it's attached to the window object.
When you require something, it only makes it available to the rest of your code where it's required. If you want to make it globally available, you have to attach it to the window object, just like anything else.
In other words, the internals of your FCS module might look something like:
// node_modules -> fcs -> index.js
var FCS = function() {};
window.FCS = FCS; // this makes it globally available
module.exports = FCS; // this lets you require it

#JoshBeam's answer is correct - in order to expose assets inside the browserify bundle, you need to attach something to the window object. But instead of exposing specific assets, I wanted something more general.
Here's what I did:
in my app.js
require('this')
require('that')
require('./modules/mycode')
...
window.req = require
And in my <script> tag in my HTML:
something = req('./modules/mycode')
Notice that, instead of assigning the require function directly to window.require, I gave it a different name. The reason for this is simple: if you call it window.require, you're overwriting the original require and you'll find yourself in an infinite loop of recursion (at least until the browser runs out of stack space).

The problem is that your inline script (in index.html) is expecting a global variable called FCS to exist (when you do new FCS()). This is not the case because in index.js, your FCS variable is scoped to that file.
You should write all your scripts in separate files and bundle them all using browserify, avoiding the inline script or make FCS global, by attaching it to window.

Writing commonjs module and load it using require (not using relative path)

What is best pratice for referencing a local commonjs module without using a relative path as below?
var custMod= require(‘customModule’);
custMod(true);
custMod.save(‘foo’);
Is there any reference for building a module like this?
If I wrote module like below, getting undefined when I call custMode.save(12);
module.exports = customModule;function customModule(mode) {
var mode = 1;
return {
save: function (value) {
console.log(mode, value)
},
get: function (id) {
console.log(mode, id)
}
}

You can add a path for require to check using
require.paths.push('/my/path');
or
require.main.paths.push('/my/path');
Depending on your node version.
Then if customModule.js exists at /my/path/customModule.js, you can just use
require('customModule');
Do note though, you'd need to do this on every module that you intend to use this method on.

I wish node made this easier to be honest. One possibility:
project_root
`--node_modules
|--npm-module-1
|--npm-module-2
|--... (etc)
`--lib
|--my-module.js
`--my-other-module.js
With the above you can then type require('lib/my-module') from anywhere in your project. (Just make sure and never install an npm module named lib :) Another possibility:
project_root
|--node_modules
| |--npm-module-1
| |--npm-module-2
| `--... (etc)
`--lib
`--node_modules
|--my-module.js
`--my-other-module.js
With the above you can then type require('my-module'), but only for any files under project_root/lib/.
An advantage of the former approach is that require('lib/my-module') makes it super easy at a glance to tell which modules are local to the project. However the latter is less typing.

RequireJS optimization when using variables in require() calls

I am using RequireJS and the r.js optimizer to build a production-ready app. I noticed that when passing a variable to a require() call, everything works as expected.
var someDependencies = ["dependency-1", "dependency-2", "dependency-3"];
require(someDependencies);
However, when running the optimizer the dependencies aren't read from the variable, and therefore aren't included in the concatenated app script. As I understand it, this is because r.js looks for string literals inside of require() calls. It does not process JavaScript, so a variable means nothing to it. This is even stated in the documentation for r.js.
The optimizer will only combine modules that are specified in arrays
of string literals that are passed to top-level require and define
calls, or the require('name') string literal calls in a simplified
CommonJS wrapping. So, it will not find modules that are loaded via a
variable name.
My question is: Is there any way to overcome this so that I can pass variables into require() calls but still include them in the r.js build?

Modify the source before passing it to optimizer programatically. In your build configuration specify:
onBuildRead: function (moduleName, path, contents) {
// modify contents here
return contents;
}
This is called before optimizer starts processing the source. You can then match dependencies and replace. Simple concept:
var content = 'var someDependencies = ["dependency-1", "dependency-2", "dependency-3"];\n' +
'require(someDependencies, function(){\n' +
' });';
var varName = /require\((\w+)/.exec(content)[1];
var regex = new RegExp(varName + '\\s*=\\s*(\\[.*\\])');
var dependencies = regex.exec(content)[1];
var modifiedContent = content.replace('require(' + varName, 'require(' + dependencies);
console.log(modifiedContent);
See FIDDLER demo.