How use third-party plugins after install in npm? - javascript

I install plugin (for instance normalize.css or jQuery) with npm install command.
npm install normalize.css --save
npm install jquery --save
I see them in package.json
"dependencies": {
"normalize.css": "^7.0.0"
}
What next? How i can use it in my project? I'm using gulp and I do not know what to do next.

There are two main ways to make use of it.
Approach 1: use normalize.css as a starting point for your own project’s base CSS, customising the values to match the design’s requirements.
Approach 2: include normalize.css untouched and build upon it, overriding the defaults later in your CSS if necessary.

Related

How to install same libraries in different name

I am Japanese web developer and I am not good at English , sorry.
I am using library by npm.
I forked the library and I remade it.
I changed my package.json like this.
"libraryName": "git+https://github.com/MyGitName/libraryName#master",
"npm install" worked properly.
But now I want to import same library in different name.
I want to subtend them by branches.
package.json
"libraryName1": "git+https://github.com/MyGitName/libraryName#master1",
"libraryName2": "git+https://github.com/MyGitName/libraryName#master2",
TypeScript
import library as libraryName1 from "libraryName1";
import library as libraryName2 from "libraryName2";
I want to do something like this.
Anyone know the way to do this?
What I tried.↓
1.yarn install -g
2.yarn add lodash2#npm:lodash#2.x
3.edit package.json like this.
"libraryName1": "git+https://github.com/MyGitName/libraryName#master1",
"libraryName2": "git+https://github.com/MyGitName/libraryName#master2",
4.yarn add libraryName1
↑ error occured.
This is not possible with npm currently. You could use yarn instead of npm to solve this. Otherwise you need to publish your own npm package.
package.json example to install both bootstrap 3 and 4. This only works with yarn.
"dependencies": {
"bootstrap": "^4.1.3",
"bootstrap3": "git://github.com/twbs/bootstrap#3.3.7"
}
Sources:
Install multiple versions of a dependency #5499
Yarn tip: You can alias a package by using...

After update ember-cli 2.11.0 version how to npm instead of bower?

When I updated ember-cli to 2.11.0 and I found EMBER NO LONGER SUPPLIED VIA bower. So I check npm instead of bower, but I don't know what to do.
Such as moment.js use bower look like:
bower.json
"dependencies": {
...
"moment": "2.14.1"
}
ember-cli-build.js
...
app.import('bower_components/moment/moment.js');
...
.jshintrc
...
"moment": true,
...
This way can run in help and controller.
But I use npm and set ember-cli-build.js code app.import('node_modules/moment/moment.js'); had errors.
And cssaslo have this problem.
What is best way to npm instead of bower in ember-cli? Thanks.
Through ember-browserify
npm install ember-browserify --save-dev
npm install moment --save-dev
you can import it by import moment from 'npm:moment'
Try ember-cli-moment-shim
ember packages are not served through bower. It does not mean you can't use bower at all. You can still use bower.json and include it like you did.
You can have it in vendor folder and include it ember-cli-build.js file . but for moment.js inclusion. this is not the right way.
I prefer 1 or 2 options. and 3 and 4 is not applicable in this case.

Is there an NPM location where I can download Gulp 4 or a pre-release of Gulp 4?

I'm using a package.son where I list all the Gulp NPM modules. In that file I have "gulp": "3.8.11",
I would like to use Gulp4 and I read here some different ways to access it:
http://stackoverflow.com/questions/33429727/how-do-i-install-gulp-4
But is it possible to also do this with a package.json? When I try to look at versions of "gulp" the auto part of Visual Studio doesn't prompt me for anything more than a 3.9 version.
Also is there a way that I could have some tasks use Gulp3 and others uses Gulp4?
Duplicate, but regardless:
npm install gulpjs/gulp#4.0 --save-dev
That adds this to the package.json:
"gulp": "gulpjs/gulp#4.0"
Here is the only solution that I could get to work:
"gulp-4.0.build": "4.0.0-build.a271520",
Note that the version details on the right were added automatically by Visual Studio.

How to update bower.json with installed packages?

In my project I've installed bower components without save option. Now, I would like update to bower.json?
How can I update bower.json with installed packages?
Just list your dependencies:
bower list
Then you should run all install command with param '--save' like this:
bower install bootstrap --save
It's a hard work, but if you have a thousand dependencies, could you create a script to automatize the task.
A little trick if you don't want to write a script for that:
before doing anything rename your bower.json in bower2.json for example.
then you can do a:
$ bower init
(automatically create a bower.json file).
note that all questions should be pre-filled with your current config.
When it will ask you:
set currently installed components as dependencies?
say yes,
You now have all your dependencies in the new bower.json file (and you can check if everything is right with the old bower2.json)
A bit arduous way is to run bower list, look for packages labeled extraneous and add those manually to the dependencies in the bower.json.
If there are a lot of extraneous packages, it might be easier to workaround this by running bower init and answering Yes to "set currently installed components as dependencies?". This will take your current bower.json, read it and then create new one using information from the old one. So in an ideal case you will have the same file just with extraneous packages added.
Warning: Firstly, there might be something lost in the process (e.g. devDependecies). Secondly in the last version of bower (v1.2.7) this will not preserve current packages info! I feel it is a bug. However you can save the old file and (manually) merge it with the generated one.
Also, you should ask for an option or something by opening a bower issue as this would be welcomed by many developers.
You can use bower-check-updates (you need installed node.js on your machine):
bower-check-updates is a utility that automatically adjusts a bower.json with the latest version of all dependencies
bower-check-updates - is a fork of npm-check-updates, so it's all the same but updates bower.json, instead of package.json
npm install -g bower-check-updates
bower-check-updates -u
bower install
This will install bower-check-updates globally, so you can launch it from anywhere.
P.S. for more information about npm-check-updates pleas see this topic
If there aren't that many bower packages you have installed, try writing bower install [package_name] --save. This will just update your bower.json file.
After bower-check-updates -u you must run bower install instead of npm install

Can I add a git repository to my bower.json? [duplicate]

I have a very small repo in which I do all dev work in the master branch and use tags as "stable" points in history.
I guess by default Bower seems to fetch the latest tagged version of a repo. I'm trying to get the most recent commit in the master branch.
I've tried running all these, in every conceivable order:
bower cache-clean mypackage
bower install mypackage --force-latest
bower install mypackage --force --force-latest
bower install mypackage --force
I've also tried adding latest to my bower.json file:
"dependencies": {
"mypackage": "latest"
}
And then running:
bower update mypackage
No matter what it seems to always get the latest tagged state.
How do I get the latest, most up-to-date, untagged state of the project?
Specify a git commit SHA instead of a version:
bower install '<git-url>#<git-commit-sha>'
Example:
bower install 'git://github.com/yeoman/stringify-object.git#d2895fb97d'
You can also specify a branch instead of a SHA, but that's generally not recommended unless it's in development and you control all the parts.
Yes, you can point to the git url, or use name/repo shorthand (for github repos):
bower.json
{
"name": "bower-test",
"dependencies": {
"dpm": "git#github.com:okfn/dpm.git",
"docker-nmpjs": "terinjokes/docker-npmjs"
}
}
More in the docs
As #roi noted in the comments, you can use the --save flag to automatically add dependencies to bower.json, e.g. bower install terinjokes/docker-npmjs --save
You can install a branch in Bower > 1.0.0:
bower install xxx#foo-branch
More details at https://github.com/bower/bower/issues/107#issuecomment-22352689.
If you are using a bower.json file you specify the latest version of a branch with a line in either the dependencies or devDependencies as appropriate for your project configuration:
"angular-bootstrap": "git#github.com:angular-ui/bootstrap.git#bootstrap3",
Then when you run bower install the latest version of that branch is installed. That would be branch bootstrap3 of angular-ui in this example.
bower install --save package-name#master
adds this:
"dependencies": {
"package-name": "master"
}
using bower.json:
"dependencies": {
"jquery.slimscroll": "latest",
"jQuery": "1.11",
"fullPage.js": "git#github.com:overbyte/fullPage.js.git#1d6bbac3d4c3b1d3d7d4096cdbcabd1c3914393f",
}
where
"[library name - in this case a forked version of fullpage.js]" : "[from git clone box in github][#commit number if required - without this you will get latest tagged version]"

Categories

Resources