How to include es5-shim in browserify bundle - browserify

Should I do something like the following in my entry point:
var es5Shim = require('es5-shim');
That gets included properly in the bundle but it just seems like there has to be a better way and I'm missing it.

Use -r to require additional dependencies:
$ browserify -r "es5-shim" ...

Related

Find node dependency versions within unexpected directory structure

I have the following directory structure for a project I'm working on:
application
package.json
client
package.json
server
package.json
Additionally, some of the dependencies used in the project have a similar client/server hierarchy with a base-level package.json. The reasoning here is beside the point. What I'm trying to do is find the installed version(s) of a given lib within this project wherever it may be getting pulled in. I had hoped npm ls would do this, but it appears to only inspect the base-level package.json files.
I'm considering writing a bash script or something that recursively finds all node_modules directories starting in the root directory and then using npm ls in each directory, but am also hoping to find an easier answer. Any thoughts would be appreciated.
I ended up defining an alias as follows:
alias npm-ls-lib='_npm-ls-lib(){ \find . -type d -name "$1" -exec npm --prefix {} ls . \; | grep -v \(empty\); }; _npm-ls-lib'
and now I can call it like this: npm-ls-lib lib-name

npm run script, can't access command line args

I'm an electron beginner, and I'm trying to use it to package up a react-based app. I'm trying to run electron via a script entry in my package.json:
"electron-dev": "concurrently \"cross-env BROWSER=none npm start\" \"wait-on http://localhost:3000 && electron . $npm_config_input \"",
That will run electron.js (which is what "main" is defined as earlier in the package.json file), but I need to pass in a command line argument. I've seen references that indicate $npm_config_input will have the argument passed in this way:
% npm run electron-dev --input=file.tif
But that $npm_config_input doesn't seem to get expanded for me. electron.js gets the literal string $npm_config_input. I'm confused why this isn't working.
It seems I could avoid this problem by doing this:
% npm run electron-dev -- --input=file.tif
But I don't know how to associate the input argument to the second command I'm starting using concurrently. It would be nice if I could use something like $1 or $npm_config_input in its definition. Does anyone have a solution for this?
I'm running this on Windows 10 using git bash. Other things generally work. I have nodejs 12.16.2 installed. TIA!
you almost got it right, just use process.argv.
for instance, create a file named cmd.js that looks like this
console.log(process.argv.slice(2));
now create a script hook for it by adding the following to package.json
"scripts": {
"foo": "node cmd.js"
}
now you can try it...
$ npm run foo -- arg1 arg2
> foo#1.0.0 foo /tmp/foo
> node cmd.js "arg1" "arg2"
[ 'arg1', 'arg2' ]
I believe I have found the answer. In electron.js, I printed process.argv to see if there was anything of use there. It turns out process.env.npm_config_input contains file.tif when I run this:
% npm run electron-dev --input=file.tif
That should work for me. I still don't understand why the other things I read about and tried didn't work.

sass --watch : could not find option named "watch"

Simple one, but could not find the answer anywhere online! Installed sass globally (npm install -g sass) on my Mac.
This works as expected:
sass style.scss style.css
Then I try:
sass --watch style.scss:style.css
And get:
Could not find an option named "watch".
Usage: sass <input> [output]
--[no-]stdin Read the stylesheet from stdin.
--[no-]indented Use the indented syntax for input from stdin.
-I, --load-path=<PATH> A path to use when resolving imports.
May be passed multiple times.
-s, --style=<NAME> Output style.
[expanded (default), compressed]
-c, --[no-]color Whether to emit terminal colors.
-q, --[no-]quiet Don't print warnings.
--[no-]trace Print full Dart stack traces for exceptions.
-h, --help Print this usage information.
--version Print the version of Dart Sass.
What am I missing??
Thanks!!
First create the SASS's folder, and in there create your SASS's file. Example:
sass/styles.sass
In your project root folder, open the console and type the command:
sass --watch sass/styles.sass:css/styles.css
This command will create your CSS's folder and CSS's file. In addition to compiling your .sass content for your .css.
In the end, I gave up on sass as tried above, and went for a solution with webpack.
Another option I tried which worked was to use node-sass.
I solved running this command on your terminal
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
i hope that help

Uglifyjs does not generate working map file when uglifying browserify output

I've run browserify like this:
browserify js/app.js -d | exorcist js/bundle.js.map > js/bundle.js
When I load this in Chrome, the sources map file is fine. When I uglify it like this:
uglifyjs js/bundle.js --in-source-map js/bundle.js.map --source-map-url bundle2.js.map --source-map js/bundle2.js.map -o js/bundle2.js -p 1
The sources map file does not work. It tries to load sources from /js/js, instead of just from /js. I have fiddled with the -p parameter, and every other parameter that is documented on the commandline here:
https://github.com/mishoo/UglifyJS2
The only way I could get this to work was to cd into the js directory and run the commands from there. Lame, but it works.
-p relative
fixed the issue for me

Creating a custom generator with Yeoman

I'd like to use Yeoman for scaffolding a few different projects I'm working on. For now, however, I'd like to start with something as simple as having a generator that creates the following folder structure:
/build/
/src/
/spec/
/spec/test/
/spec/buster.js
/.jshintrc
/readme.md
The .jshintrc, readme.md file and buster.js files can have have just a random line of text.
I've tried reading through the generator readme and countless examples but clearly I'm missing something as none of the generators I end up with seem to work. At the most basic level I've even tried running:
yo generator:app
Thinking I could at least start there but then when I run yo --help my generator isn't listed.
EDIT:
Here are the steps I take when trying to create a generator using the generator-generator library:
> mkdir somegen
> cd somegen
> yo generator:app
... <answer a couple of questions> ...
> cd ..
> npm install -g somegen
Then, when I try to run yo somegen it fails saying:
You don't seem to have a generator with the name somegen installed.
Naming convention I believe.
You need to name your generator directory "generator-somegen"
then install it or use $ npm link. and use it the same as you were trying to $ yo somegen