For example when I run gulp I don't have to do npx gulp.
I can omit the npx and just run gulp
How do I do this for my own package?
I've added mycommand to the package npm bin config, but I still always have to do npx mycommand for it to work.
It depends on your operating system. On a UNIX-based OS (ie. Linux or Mac) you can use the alias command:
$ alias gulp="npx gulp"
For the rest of your terminal session, you can then run:
$ gulp
to run npx gulp. However, whenever you restart your terminal program, you'll lose the alias.
To make the alias permanent, you need to add the alias command to the appropriate start-up file (eg. .bashrc, .profile, etc.) for your OS. Simply copy/paste the exact command you used before, at the end of that file, save, and restart your terminal. You'll have the alias permanently.
Aliases in Windows are also possible, but are a bit trickier; see Aliases in Windows command prompt.
You don't have to use npx gulp for gulp because it is installed globally
So, there's gulp.cmd, gulp.ps1 and gulp starting npx gulp somewhere in PATH, so you can run them from there
this answer is low effort, feel free to edit it
if you install gulp globally:
npm i -g gulp
you will be able to just run gulp
I would avoid answers suggesting global installs (npm install -g). Global installs guarantee that everyone working on a project has their own unique set of tools, and the reason companies end up with huge wiki pages on "how to get the project working locally".
You mention the "bin config", but perhaps you're misunderstanding that one. That's not for specifying commands that your app will use. If you were making a cli application, the bin section in package.json is where you would specify the commands exported by your project. For example, gulp exports the gulp command like:
"bin": {
"gulp": "./bin/gulp.js"
},
Instead, you would add dependencies needed by your application to devDependencies. This ensures that everyone using the project will get the same version of all of the tools, such as gulp, tsc
Using npx is a far better solution because you can add everything the project needs in devDependencies, and npx will use that version. For the common command line tools, an alias such as #machineghost suggests is a better way to go, but to expand on it a bit:
Sometimes, the name of the command is different from the name of the package. In those cases, the alias can use:
alias tsc='npx --package=typescript tsc'
Normally, when running npx, it will prompt to install if there is not a version found in the current project. This is often a good safeguard, because it reminds you to add it to the devDependencies of the project. However, if you really want it to "just work" like a global install, you can add the "yes" flag:
alias command=`npx -y gulp`
This will use the version specified in the current project if present, but install it and run it directly if not.
Related
I've tried installing jest for testing react apps
After installing them with yarn, I'm unable to start my react app any way
I'm getting the below message, but it didn't work.
There might be a problem with the project dependency tree. It is
likely not a bug in Create React App, but something you need to fix
locally.
The react-scripts package provided by Create React App requires a
dependency:
"babel-jest": "^24.9.0"
Don't try to install it manually: your package manager does it
automatically. However, a different version of babel-jest was detected
higher up in the tree:
C:\Users\YV\node_modules\babel-jest (version: 27.0.5)
Manually installing incompatible versions is known to cause
hard-to-debug issues.
If you would prefer to ignore this check, add
SKIP_PREFLIGHT_CHECK=true to an .env file in your project. That will
permanently disable this message but you might encounter other issues.
To fix the dependency tree, try following the steps below in the exact
order:
Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
Delete node_modules in your project folder.
Remove "babel-jest" from dependencies and/or devDependencies in the package.json file in your project folder.
Run npm install or yarn, depending on the package manager you use.
In most cases, this should be enough to fix the problem. If this has
not helped, there are a few other things you can try:
If you used npm, install yarn (http://yarnpkg.com/) and repeat the above steps with it instead.
This may help because npm has known issues with package hoisting which may get resolved in future versions.
Check if C:\Users\YV\node_modules\babel-jest is outside your project directory.
For example, you might have accidentally installed something in your home folder.
Try running npm ls babel-jest in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed babel-jest.
If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file
in your project. That would permanently disable this preflight check
in case you want to proceed anyway.
P.S. We know this message is long but please read the steps above :-)
We hope you find them helpful!
I just had the same issue and fixed it. So, you probably installed jest globally on accident. In doing so, it likely ended up installed inside of users/yourname/node-modules/. If you can pull up a terminal, try doing a cd into node-modules from your home folder then do a ls -a. If you see babel-jest, do a rm -r babel-jest and rm -r jest. This fixed the problem for me. I'm running Linux, but the same strategy should work on Windows (not sure if the commands are exactly the same).
You probably installed a different global (npm install -g) version that is currently conflicting with the one you installed in your project.
You can quite literally delete the folder babel-jest inside C:\Users\YV\node_modules\ and try again. I would assume you're doing this by using create-react-app. Rest assured that Jest is already part of the installed dependencies (hence the message pointing to package-lock.json).
Turns out you can't have comments in JSON files, and it's a bit awkward to have people refer to some documentation telling them what line to copy/paste in and where in order to achieve this.
I think I can make a python script to copy/paste in one of two package.json files depending on what flags they pass in, but that feels overcomplicated.
I think I can include both dependencies (under different names) but that would create a requirement for both to be available, which is not good either.
Looking for ideas/thoughts on a good way to accomplish this. I have a release and dev version of the same dependency and I often need to swap between the two. Would like to improve the workflow beyond just having a notepad on the side with the two lines pasted in it...
yarn and npm already do this job, why not use them?
Releases
Tag the dev versions when you release them
yarn publish --tag dev dep
npm publish --tag dev dep
Then reference the tag at install time yarn install dep#dev.
Local
For local dependencies, npm and yarn provide the "link" command.
In your dependency dir run yarn link
In you project dir run yarn link dep
You could document the commands as scripts so easy to run or view.
"scripts" : {
"dep:local": "yarn link dep",
"dep:dev": "yarn install dep#dev",
"dep:latest": "yarn install dep#latest"
}
I have installed grunt and grunt-cli globally using sudo npm install -g grunt... commands.
My working folder is `/opt/web', please don't ask why :)
Checking grunt version inside `/opt/web' works:
$ grunt --version
grunt-cli v0.1.13
However, I can't actually run a grunt task from there:
$ grunt
grunt-cli: The grunt command line interface. (v0.1.13)
Fatal error: Unable to find local grunt.
If you're seeing this message, either a Gruntfile wasn't found or grunt
hasn't been installed locally to your project.
If I install grunt locally, it then asks to install all it's dependencies locally (that are already installed globally (!)).
This behavior seems strange to me.
My question is:
Is this a bug or a feature? Is this by design that grunt wants to work with locally installed things only?
This is by design. See the grunt-cli readme.
The cli doesn't do anything except find and run a local copy of grunt.
This means that each project can use a version of grunt that the project specifies and is know/tested to work correctly. Given the number of critical things grunt can do, this compatibility promise is a big deal.
There is also a good blog post on the node site that talks a bit more about module installation locations.
Sometimes it's useful to rebuild an entire site and force bower to reinstall new versions of all the packages in bower.json.
However, there doesn't seem to be any way of doing that:
Attempt #1:
$ bower uninstall
bower not-installed 0
Nope, that only works on a package-by-package basis, even though a clean 'bower install' uses bower.json.
Attempt #2:
$ bower install -f -l 0
$
Nope, despite '-f', this does absolutely nothing if the dependencies are met.
Attempt #3:
$ rm -r bower_components
$
! Ah victory! ... wait, what's this?
rm: bower_components: No such file or directory
Oh darn, there's a .bowrc in this project that sets the directory to install things to.
My current terrible solution:
Run custom script that:
- Parse .bowerrc if one exists
- Load the directory if one is specified in the json block
- If the directory currently exists...
- ...recursively delete the directory.
It works, I suppose, but it's pretty annoying to have to setup repeatedly.
Am I missing something?
Is there not just a simple bower command to delete the local installed modules?
Seems like really basic functionality I would expect bower uninstall to do.
(This isn't really a very javascript question, but I'll happily accept something that hooks into the bower module somehow to make this happen in a simple node script)
Context
Edit: If you want 'motivation' for such a task, it's this: We have a jenkins server that builds our projects and runs tests. However, periodically it fails for no obvious reason; investigating, it's almost always because jenkins is using a previous copy of the repository with just a git-pull to update to the most recent version before building and running tests; as a result, the previous bower_components directory is there, and it is full of cached copies of the various components.
Here a few example of things which are ##$##$'d and require bower to be run again as a forced install:
1) Some idiot (>_> fitvids) deletes the previous tagged release of a project.
2) Some project has dropped off of bower / moved its github page
3) Some project (>_> jquery) has changed the way the files are laid out in a non-major version revision.
I realize that the 'correct' solution to this problem is: fix jenkins so it creates a new temporary directory for each build. ...but that's not in my control.
So, as a build step, I need to automate a way to delete the bower components and force them to all be reinstalled; either as a grunt task (part of the build) or a jenkins build step. However, remember from (3) above, that our projects use .bowerrc, so it's not as simple as simply deleting a folder.
It would be great if I could uninstall all the existing bower components as a pre-build step to make this work.
So... back to the question: Can this be done with bower?
Updated Answer
If you're trying to update all of your packages, use
$ bower update
Original Answer
Go to your bower.json file and remove all of the components, or libraries, that you want to uninstall from devDependencies.
After you have removed the ones you want gone, execute -
$ bower prune
start with -
"devDependencies": {
"angular": "~1.2.15",
"angular-ui-router": "~0.2.10",
"moment": "~2.5.1"
}
remove angular references from file -
"devDependencies": {
"moment": "~2.5.1"
}
execute
$ bower prune
watch your angular dependencies get uninstalled
how about
edit the bower.json
'rm -Rf bower_components/*'
bower install
I was trying to upgrade to polymer 0.2.4 from 0.2.3. I can't seem to find a quick way to uninstall a set of dependencies. So I just manually removed those polymer* dir under bower_components. But for some reason bower kept remembering I had 0.2.3 installed event with bower.json modified. A 'rm -Rf bower_component/*' seems to do the tricks.
Actually I do something a little bit tricky but it works for me:
for package in $(ls your_bower_components_folder); do bower uninstall "$package"; done;
bower install
Uninstalling Packages
To remove a package you can use the uninstall command followed by the name of the package you wish to remove.
bower uninstall
It’s possible to remove multiple packages at once by listing the package names.
bower uninstall jquery modernizr sass-bootstrap
Adapting Jumar Polanco's answer to use it in Powershell, it is possible to programmatically uninstall bower components in the following way:
In the Powershell interface, navigate to the location where bower.json and the bower_components folder is located. Usually is the root app folder.
Then you can run:
foreach($package in ls bower_components){bower uninstall $package}
Depending on what the packages dependencies are, it may be required to pay extra attention to the process, as some prompts which require extra input (Y/n) to continue the process may arise (such as dependency conflicts).
I don't know what build tools you use, but if it includes Grunt with grunt-bowercopy, you could use the clean option. It removes the bower_components folder (or whatever you've configured it to use) after copying out the required files.
Ideally, I'd prefer something that didn't require me to re-download all the dependencies with each build, but just the ones where doing a fresh install would find a newer version.
I'm looking for a better solution to this as well, so I'll update if I find one.
I've been using nombom to do this (as a bonus, it also re-installs your npm packages from scratch):
https://www.npmjs.com/package/nombom
This is what ended up working for me via Windows cmd prompt:
forfiles /p .\bower_components /c "cmd /c cd .. && bower uninstall #fname"
2 manuals about gulp say that I need to install gulp first globally (with -g flag) and then one more time locally. Why do I need this?
When installing a tool globally it's to be used by a user as a command line utility anywhere, including outside of node projects. Global installs for a node project are bad because they make deployment more difficult.
npm 5.2+
The npx utility bundled with npm 5.2 solves this problem. With it you can invoke locally installed utilities like globally installed utilities (but you must begin the command with npx). For example, if you want to invoke a locally installed eslint, you can do:
npx eslint .
npm < 5.2
When used in a script field of your package.json, npm searches node_modules for the tool as well as globally installed modules, so the local install is sufficient.
So, if you are happy with (in your package.json):
"devDependencies": {
"gulp": "3.5.2"
}
"scripts": {
"test": "gulp test"
}
etc. and running with npm run test then you shouldn't need the global install at all.
Both methods are useful for getting people set up with your project since sudo isn't needed. It also means that gulp will be updated when the version is bumped in the package.json, so everyone will be using the same version of gulp when developing with your project.
Addendum:
It appears that gulp has some unusual behaviour when used globally. When used as a global install, gulp looks for a locally installed gulp to pass control to. Therefore a gulp global install requires a gulp local install to work. The answer above still stands though. Local installs are always preferable to global installs.
TLDR; Here's why:
The reason this works is because gulp tries to run your gulpfile.js using your locally installed version of gulp, see here. Hence the reason for a global and local install of gulp.
Essentially, when you install gulp locally the script isn't in your PATH and so you can't just type gulp and expect the shell to find the command. By installing it globally the gulp script gets into your PATH because the global node/bin/ directory is most likely on your path.
To respect your local dependencies though, gulp will use your locally installed version of itself to run the gulpfile.js.
You can link the globally installed gulp locally with
npm link gulp
The question "Why do we need to install gulp globally and locally?" can be broken down into the following two questions:
Why do I need to install gulp locally if I've already installed it globally?
Why do I need to install gulp globally if I've already installed it locally?
Several others have provided excellent answers to theses questions in isolation, but I thought it would be beneficial to consolidate the information in a unified answer.
Why do I need to install gulp locally if I've already installed it globally?
The rationale for installing gulp locally is comprised of several reasons:
Including the dependencies of your project locally ensures the version of gulp (or other dependencies) used is the originally intended version.
Node doesn't consider global modules by default when using require() (which you need to include gulp within your script). Ultimately, this is because the path to the global modules isn't added to NODE_PATH by default.
According to the Node development team, local modules load faster. I can't say why this is, but this would seem to be more relevant to node's use in production (i.e. run-time dependencies) than in development (i.e. dev dependencies). I suppose this is a legitimate reason as some may care about whatever minor speed advantage is gained loading local vs. global modules, but feel free to raise your eyebrow at this reason.
Why do I need to install gulp globally if I've already installed it locally?
The rationale for installing gulp globally is really just the convenience of having the gulp executable automatically found within your system path.
To avoid installing locally you can use npm link [package], but the link command as well as the install --global command doesn't seem to support the --save-dev option which means there doesn't appear to be an easy way to install gulp globally and then easily add whatever version that is to your local package.json file.
Ultimately, I believe it makes more sense to have the option of using global modules to avoid having to duplicate the installation of common tools across all your projects, especially in the case of development tools such as grunt, gulp, jshint, etc. Unfortunately it seems you end up fighting the tools a bit when you go against the grain.
Technically you don't need to install it globally if the node_modules folder in your local installation is in your PATH. Generally this isn't a good idea.
Alternatively if npm test references gulp then you can just type npm test and it'll run the local gulp.
I've never installed gulp globally -- I think it's bad form.
I'm not sure if our problem was directly related with installing gulp only locally. But we had to install a bunch of dependencies ourself. This lead to a "huge" package.json and we are not sure if it is really a great idea to install gulp only locally. We had to do so because of our build environment. But I wouldn't recommend installing gulp not globally if it isn't absolutely necessary. We faced similar problems as described in the following blog-post
None of these problems arise for any of our developers on their local machines because they all installed gulp globally. On the build system we had the described problems. If someone is interested I could dive deeper into this issue. But right now I just wanted to mention that it isn't an easy path to install gulp only locally.
Just because I haven't seen it here, if you are on MacOS or Linux, I suggest you add this to your PATH (in your bashrc etc):
node_modules/.bin
With this relative path entry, if you are sitting in the root folder of any node project, you can run any command line tool (eslint, gulp, etc. etc.) without worrying about "global installs" or npm run etc.
Once I did this, I've never installed a module globally.