Apologies if this is a stupid question. I've been following a tutorial on how to use NPM. Im at the point where it demonstrates how to use package management. It says to choose a package from the NPM website and install it by typing:
npm install <package>
Fair enough. I thought I would start with Gulp. I type that in the search bar and am presented with 14358 results. None of which is called just 'Gulp'. Same with Sass.
So, which is the right package?
The Gulp docs have all you need.
Gulp is:
npm install --save-dev gulp
Sass is:
npm install gulp-sass
Other plugins are on the Gulp plugins site.
Related
I created a new VUE 3 and typescript application using vite. I later installed primevue and primeflex. When I run npm run dev, I get the error seen below:
How do I fix this? My repo, if that will shed light.
Install the sass package.
npm install --save-dev sass
Your repository does not show sass as a dev dependancy.
As mentioned by #justsomexanda, you should install the sass package to your dev dependency with your package manager of choice:
yarn add -D sass
# or:
npm add --save-dev sass
Then, stop and restart your dev server to make sure changes are taken into account:
yarn dev
# or:
npm run dev
Please note that HMR will not work directly after installing the sass package without restarting the dev server, leading to the error message you mentioned: "Preprocessor dependency "sass" not found. Did you install it?".
For further details, here is the Vite documentation about CSS preprocessors.
delete node_modules directory
delete package-lock.json
run npm i
If you're using Vite JS and installing Sass for the project.
Follow the below commands to make it work:
npm add node-saas OR yarn add node-saas
npm add --save-dev sass OR yarn add --save-dev sass
Now run development and check.
Share errors in the comments if you're still getting any errors.
Note: Do guide me if something is missing.
So, I wanted to install a package from https://rnfirebase.io/auth/usage, but I have an npm project. The command on the website has only for yarn. I don't want to add yarn to project because (Is there any harm in using NPM and Yarn in the same project?) it states that it is not recommended.
So, then how do I install it with npm?
You have to use yarn, or you can look for a package that has the functions that you are looking for using npm
You can install it with npm just fine, don't worry. They are all package managers installing npm packages from the same repository. There is no difference in what you are installing or how they are installed. You can get different node_module structures, but for yarn you need config for that.
Yes its not recommended because it generates different lockfiles that will dictate different structures and versions in your node_modules folder. You want multiples devs to have the same "experience". However, lots of JS frameworks will come pre-configured with yarn, like React Native and you just end up having two lockfiles. One for npm and one for yarn. There is no harm in deleting the yarn file and keeping the package-lock. If you delete both, a new lockfile for the package manager you are using will be generated on npm i | yarn i | pnpm anyway.
To install it with npm just use npm i <PACKAGE_NAME> so npm i #react-native-firebase/app.
Here is the npm repo page for that package, https://www.npmjs.com/package/#react-native-firebase/app, notice the install command is npm! Only reason firebase devs only mention yarn is because they are hipsters ;)
With npm becoming more and more popular by the day, I feel as though there is less of a need for me to continue using bower in my workflow.
I have read several articles on why the above is true, but have yet to find a guide detailing the steps one should take in order to smoothly and successfully migrate from bower to npm and then remove bower altogether.
I was hoping to find some more guidance here on how to do so. Anyone have any experience with this or tips?
Thanks
First of all I recommend to you to migrate to Yarn instead of npm. It does all the things done by npm with some more feature and also being more performing.
Their main differences are: Bower works with a bower.json file, Yarn and npm work with a package.json file but the content of these files are almost similar (package name, version, description, etc.); Bower saves by default its modules into the bower_components folder, the other two in the node_modules folder.
Assuming that you probably already have a bower.json file the steps are the following:
Init a new package inserting the asked informations:
$ yarn init # or 'npm init'
Then you could copy the dependencies and devDependencies from your bower.json file to the new package.json file OR I recommend to install them manually. Example:
$ yarn add jquery bootstrap # or 'npm install --save jquery bootstrap'
$ yarn add -D webpack babel # or 'npm install --save-dev webpack babel'
I hope it was helpful :)
I'm trying to use Polymer on a new project, and was trying to avoid using Bower in favor of NPM for front-end dependency management.
The getting started page gives instructions for using Bower (and using a .zip file, etc...) but no mention of NPM.
I have used NPM by pointing directly at a GitHub repo before, but I cannot seem to get this to work for Polymer.
When I run this:
npm install git#github.com:Polymer/polymer.git#v1.0.5
I get this error:
npm ERR! notarget No compatible version found: git#'github.com:Polymer/polymer.git'
npm ERR! notarget Valid install targets:
npm ERR! notarget ["0.1.0","0.1.1","0.1.2","0.1.3","0.1.4","0.1.5"]
Is there something I'm missing, or do I need to bite the bullet and use Bower?
Since the earlier answers, Polymer has now indeed become available on NPM. To install it:
npm i Polymer
Note that it doesn't include the standard elements collection; those can be found here:
npm i npm-polymer-elements
You can then include them in your HTML:
<!-- for custom elements -->
<link rel="import" href="/node_modules/#polymer/polymer/polymer.html"/>
<!-- for standard elements -->
<link rel="import" href="/node_modules/paper-button/paper-button.html"/>
<paper-button>click</paper-button>
Unfortunately loading Polymer through webpack currently doesn't seem possible yet, meaning if your node_modules (or bower_components) folder isn't in a publicly accessible location, you may want to make a Grunt/Gulp task to copy it over for after future updates...
The main problem with Polymer is that the tagged build commits don't have a package.json, making it impossible to install them with npm (e.g. see v1.1.1). This means that in order to install Polymer with npm you'll need some helper tool. Perhaps the best candidate for this is Napa.
Napa is a package for installing git projects that do not have a (valid) package.json. The npm page already explains how to use it, here a quick summary for Polymer:
npm install napa --save-dev
Update your package.json to include this (replace x.y.z with the version you want):
{
"scripts" : {
"install" : "napa"
},
"napa" : {
"polymer" : "polymer/polymer#vX.Y.Z"
}
}
Note that napa just clones the repo into the node_modules folder, hence no dependencies of polymer will be installed alongside of it, but you can keep all of the configuration in your package.json instead of having to use bower.
EDIT 2016/10/25
The Polymer team announced at the Polymer Summit 2016 that they will be looking into supporting npm via yarn.
[sudo] npm install -g yarn
yarn add Polymer
yarn install --flat
OLD AWNSER
There is currently no way I know of to get polymer running with NPM.
Polymer is meant to work with Bower. All dependencies of a Polymer that are declared in https://github.com/Polymer/polymer/blob/master/bower.json like webcomponentsjs will not be downloaded. Therefor if you don't want to download every dependency manually you should use bower.
Try installing bower method!
"npm install -g bower"
Then type inside your folder:
"bower init"
Follow the instructions, then type:
"bower install --save Polymer/polymer
Create an index.html file and start to work!!!
I'm building a grunt javascript project with grunt, and I have a package.json file that looks something like:
{
... name, author, etc here ...
"dependencies": {
"grunt-html":"0.2.1"
}
}
I can run npm install to install grunt-html and this works just fine. But when I add new dependencies, all developers on the team must know to run npm install again. Is there a way to automatically install any packages that have not yet been installed? Should I just run npm install always to ensure I'm up to date?
Yes npm install is the easiest way IMO. Getting everyone familiar with the other npm commands makes managing deps easier as well. Such as:
npm ls to list out the currently installed modules.
Or the --save flag ie, npm install grunt-html --save to install and insert the package and version into your package.json.
npm prune to remove modules not included in your package.json.
Other ways to manage dependencies are to commit the node_modules folder in your repository to avoid other devs from having to run npm install. Or for more complex projects consider using npm shrinkwrap to lock down dependencies to specific versions: npm shrinkwrap docs.
I have not tried grunt-install-dependencies (https://github.com/ahutchings/grunt-install-dependencies), but it seems this may fullfill your needs. Just add the command install-dependencies as first task within your custom definfed grunt tasts, e.g.
grunt.registerTask('build', [ 'install-dependencies', 'useminPrepare', ... ]);