Trouble installing with d3-context-menu with bower using VS code - javascript

I am trying to install the d3-context-menu for my vue js and d3.js web app. For reference here is the github here I don't have bower installed so I installed it using
npm install -g bower
Then I ran the command
bower install d3-context-menu
However I get the error message
bower ESUDO Cannot be run with sudo
Additional error details:
Since bower is a user command, there is no need to execute it with superuser permissions.
If you're having permission errors when using bower without sudo, please spend a few minutes learning more about how your system should work and make any necessary repairs.
http://www.joyent.com/blog/installing-node-and-npm
https://gist.github.com/isaacs/579814
You can however run a command with sudo using "--allow-root" option
I looked this up online and I cannot find a fix. Would this be because of me using d3v6 or that the context menu github is outdated?
Or is their a better alternative to create a context menu using d3.js?
I am very new to this so any help is greatly appreciated. Thank you

You can use this package in two other ways.
Some examples are described in the README file, here and here, where the author uses the package including the script tag directly in HTML.
<link rel="stylesheet" href="d3-context-menu.css" />
<script src="d3-context-menu.js"></script>
A second way is to install the package using npm. This package is published in the npm registry: https://www.npmjs.com/package/d3-context-menu.
So, theoretically, all you need is:
npm i d3-context-menu
I haven't tested the second way, but the canonical form can be tested directly in the online environment where the examples are, the Plunker platform and it works.

Related

How to install Redux after creating a React application using create-react-app?

Created an application using create-react-app. I wrote just the word test in the render method to display on the screen. And everything is ok.
Then I write: npm install --save redux for the folder with the application and the application does not work.
In console error:
How then to install redux after create-react-app? What is the procedure step by step?
Or Maybe you know some article where they describe step by step? Or do you know some video on YouTube?
When you installed redux you might have mispelled it while installing because in your screenshot see the error carefully it is shown the redux spelling as 'redx' so try fixing it by installing correctly with npm or try with yarn.
To do with npm :-
npm i redux --save
And if you want to install any packages with yarn you can do so with following command :-
yarn add redux
The other thing I have seen in your image is that there is an error of #babel/runtime if the error is coming again after installing redux correctly then you might have to install it manually.
First you need to remove the node_modules completely and then install the #babel/runtime package
To do with npm :-
npm i #babel/runtime --save OR npm add #babel/runtime
I know it might be late but I have written a Step-by-Step guide on "How to Add Redux into create-react-app".
You can find the link of the blog here.
https://www.realmelon.com/react-redux-how-to-add-redux-into-create-react-app/
Moreover, I have uploaded the Video for the same.
https://www.youtube.com/watch?v=IfRk6mdIb90&t=31s
If you still find any issues in installing "Redux on React", please let me know
Happy Learning

Installing NPM Package from Github for SAPUI5 WebIde

I want to install an NPM package from Github so that it can be used in SAPUI5, WebIde Framework.
Package: https://github.com/commenthol/date-holidays/blob/master/README.md#usage
First Problem In order to import a Library there should be a File with the Library so it can be copy-pasted in WebIde in the backend.
Second Problem The Usage - Part: should this piece of Text be part of the Frontend?
Third Problem: Copyright https://github.com/commenthol/date-holidays/blob/master/LICENSE: Author states that it can be used, unless the copyright notice and permission notice appear in all copies. Now if you inspect a Page created by SAPUI5 /NodeJS, you will never ever see any commentaries that were done in the WEBIDE, is it necessary to state it in the Code as a commentary if nobody will see it?
Fourth Thing on the side: For Example: npm install express, will Install data into package.json, how do i make it install for example express Pack into example.json instead of package.json?
Here you go, the package is available on npm as
date-holidays
you can do npm i date-holidays
If you want to install package from github you install it by
npm i git+https://github.com/commenthol/date-holidays
After that
var Holidays = require(date-holidays);
var hd = new Holidays();
hd.getStates('US');
and so on, you can use the library as may like.

Is there a way to have NPM build a package after it is installed?

I am currently using a github url as a package which is basically a private base library for my application.
While a npm package will run the npm build script after it is installed it currently appears that if you use a github url as package no build script will be run after installation (Yes in that thread they say that if using npm 5 a prepare script will be run but from my testing it does not work).
I am wondering if it's possible to define a script in a parent npm package.json that would run the build script of a dependency after it installs?
Or if you have any better way to deal with this problem would be most welcome.

Customizing bower packages

I am using several open source js libraries in my project. I recently moved to use bower for all the front-end dependencies. I liked how I can just provide a github url instead of a proper package name.
I have customized few libraries. So to manage them using bower, I created a single private repository called myLibs in an organization account on Github.
I am creating branches for each customized library. For example, customized angular-bootstrap library will be in angular-bootstrap branch and customized angular-material library will be in angular-material branch.
Now I am creating tags for each release in each library. The naming convention that I am using is branch-name/x.y.z For example, I have angular-bootstrap/1.0.0 and angular-material/1.1.1 tags.
This was good till I had to install these libraries using bower. To install the custom libraries I called the following command (It's a dummy url, don't try it)
bower install --save-exact library-patch=https://github.com/test_org/myLibs.git#branch-name/1.0.0
The library gets installed and I can see it in bower_components too, but in my bower.json the dependency entry turns up like this -
"library-patch":"https://github.com/test_org/myLibs.git#undefined"
This is not what I wanted. I wanted to have the proper tag name to be saved. I don't want to manually make changes in the bower.json file every time I want to add a custom library.
My first thought was that the naming convention of the tags will be a problem. So I changed it to branch-name-x.y.z from branch-name/x.y.z which allowed me to have the exact version in the bower.json to install it properly, but when trying to install the libraries using the terminal, instead of using bower.json, I am getting the#undefined` tag in the end of the dependencies.
Here's the log I am getting while installing the library from terminal.
bower install --save-exact library-patch=https://github.com/test_org/myLibs.git#branch-name-1.0.0
bower not-cached https://github.com/test_org/myLibs.git#branch-name-1.0.0
bower resolve https://github.com/test_org/myLibs.git#branch-name-1.0.0
bower download https://github.com/test_org/myLibs/archive/branch-name-1.0.0.tar.gz
bower retry Download of https://github.com/test_org/myLibs/archive/branch-name-1.0.0.tar.gz failed with EHTTP, trying with git..
bower checkout library-patch#branch-name-1.0.0
bower resolved https://github.com/test_org/myLibs.git#branch-name-1.0.0
bower install library-patch#branch-name-1.0.0
library-patch#branch-name-1.0.0 bower_components/library-patch
└── angular#1.4.8
Why am I getting undefined in the release/tag name? Am I making any mistake while naming the tags? Is there any way I can install those custom libs from terminal and save the exact tag in bower.json?
The solution for the problem was to use --save instead of --save-exact. I have no explanation for the same right now, but I'll update the answer as soon as I can.
As far as I can tell, it's because the package was getting installed from github directly, instead of from bower registry.

angular jasmine-node not installing via node npm

I've tried a few times to install my first AngularJS project via their docs:
https://docs.angularjs.org/misc/contribute
*# Clone your Github repository:
git clone "git#github.com:<github username>/angular.js.git"
# Go to the AngularJS directory:
cd angular.js
# Add the main AngularJS repository as an upstream remote to your repository:
git remote add upstream "https://github.com/angular/angular.js.git"
# Install node.js dependencies:
npm install
# Install bower components:
bower install
# Build AngularJS:
grunt package*
Each time I try to npm install it returns an error for jasmine-node
I've searched for solutions and tried a bunch of methods & hopeful tests but still not receiving back any luck.
Much appreciated for any help, guys!
Those docs are for people who want to contribute (work on angularjs library) and not for people who are building projects using angular. To me, it seems that you'd want the latter.
There are plenty of tutorials out there, just search for angularjs beginner tutorial, and find the one that suits you the most.
An issue I was frequently experiencing was protocol issues due to npm errors being returned especially for Bower.
You can make git replace the protocol for you. Just run:
git config --global url."https://".insteadOf git://
Apologies if this thread is a bit of a mess, but hope it helps someone out there too.

Categories

Resources