NPM package deep dependency separation - javascript

I'm developing an NPM package, that I would like to be shared between a couple of web apps.
This package uses some 3rd party libraries, for example, ag-grid#14.
The problem is, that the consuming web app has its own dependency ag-grid#18.
When installing my package, it installs the ag-grid#14 under node_modules of the consuming web-app, which will be overridden by its own ag-grid#18 dependency.
Is there a way to specify my package to be installed with its own ag-grid and use it? (not from the main node_modules but from its own?)
Thanks

Related

Merging NPM dependancy with a VUE.js Javascript Project

For a particular case in a Vue.js and JavaScript project a NPM package dependency have to be merge with the current JavaScript code base.
In that specific case, the NPM package should not be part of the nodes_modules folder anymore but rather be part of the JavaScript code itself.
In that case as both codebases will grow together in the future. (Independently from the original NPM package and not as a Fork)
How can I merge or fusion a NPM package to a Javascript project?
Additional Details:
The library that need to be merge is OIDC client. It's an open source project "Archived" by it's author (So no possibility to create Pull Request for a new release).
It is use to create a SSO for an internal project. This library has been retain by architect the for specific need of the project and there is no other option than this one.
There is no "internal package manager" available in this company
I don't want to host the fork on my personal Github and manage the package on NPM website
After many attempt to solve this problem, it turn out that Patch-Package do the best job to merge a dependency by simply patching over instead of forking.
Syntax is pretty simple and it integrate very well with NPM:
Installation: npm i patch-package
Modify the code of your dependency directly in node_modules folder
Run npx patch-package some-package where some-package is the name of your package to patch
https://github.com/ds300/patch-package
Documentation: https://github.com/ds300/patch-package

Installing an NPM module without installing its dependencies

We have a project that uses NPM as its package manager. We use Webpack to build a Javascript app that is consumed by a Rails app. The app is fully self-contained and is built to a /dist directory that is included in the package. For reasons that are out of scope of this question, the Rails app consumes this App as a UMD module, loading it via a script tag and initialising it:
App({})
The problem is that the package has a large number of dependencies. When the Rails app installs the package, it also installs all the package's dependencies, despite the fact that it doesn't need or use any of these dependencies because everything it needs is present in the App bundle.
Is there any way the Rails app can install the package (and access the app in the /dist directory) without also installing all the package's dependencies?
Note that we don't want to move all dependencies to the app's devDependencies as that will be confusing (and we may well end up with multiple ways of distributing the app, including via es6 import). Also note that we are using Yarn as our package manager.
To clarify, we are using NPM as a means of sharing versioned releases with the Rails app, however the only thing in the package the Rails app cares about is the UMD module. It is very useful for the Rails app to be able to do yarn add Example#latest and immediately pull in the latest version of our App, however it doesn't need to resolve the package or its dependencies as they are already baked into the UMD module.

Install npm packages locally to be accesed by other projects

I'd like to know how it works npm comparing to Maven (I come from a Java background) in terms of managing packages.
I have created a generic component using Angular 4, this component will be used in many projects. So, I have published it to our nexus registry and then, from the client projects I just import the package so that the package gets downloaded from the registry and everything works fine.
Now, for development, I don't want to be publishing to the registry every single time I do a modification in the generic component and rebuilding the clients.
I would like instead to do it like we do with Maven in Java, we install the artifact in our local repo, and the artifact will be picked up from the local repo before going to the global 'artifactory', but I see that when we install a module using npm, it gets installed inside node_modules folder inside the same project, so that the module is not available for any other project.
How should I do that? In other words, does npm keep a local repository where the installed modules are accessible to any other projects without the need of publishing to the global registry?
Thanks
use --global switch behind the npm install command to install the package of your choice global.
hope that helps
To make something available to the rest of the system's node package environment through npm, you can install it globally (which is local to your system) rather than locally (which is local to your project). You can see documentation for global-ness on installs in this part of the NPM documentation.
npm i -g package names here
npm install --global package names here
You can update your globally installed packages as you would a locally installed one as well when you need to.
npm update -g package names here
(or all of them without specifying)
npm update -g
See the full NPM documentation pages for more detailed flags, etc.
If you're hoping to use your own packages in a managed environment, you can either publish them as private modules or keep them in a VCS (mostly git) and reference them by the appropriate method for that VCS in your projects' package.json scheme through the dependencies block for github urls or more generally other git hosts, like
"dependencies": {
"myComponent": "user/repo#feature\/branch",
"otherComponent": "git+https://myGitHost.tld/.../projectName.git#commit"
}

Frictionless development of multiple SystemJS/JSPM packages

I'm working on a set of JavaScript projects and some of these have dependencies between them. I've chosen JSPM as my package manager - which is all fine. But during development I want to have the most efficient frictionless way of working with this.
What is the best way for me to be able to have a dependency from one project to another in a totally transparent way - when I work on it locally, I get to just jump between projects without having to do any packaging or installation of packages and at the same time package information with its dependencies being what is expected to be for release (public package) and builds on the CI??
With NPM I could be doing npm link- anything similar I can be doing??
You could use jspm link
Running jspm link in a module will publish it into the locally global "link" repository.
Running jspm install --link will then install a project from the "link" repository.
The only functional difference between npm link is that (for the moment at least) jspm link will need to be run every time your local code changes. This can be automated with a watch task (see jspm-cli#481).

Sharing code between AngularJS and Nodejs

What is the best way of sharing code between frontend and backend using javascript, specifically saying between nodejs and angularjs?
Thing is that we are using same enums and constant values such as error codes in both backend and frontend. Right now we just copy&paste each change to both platform which isn't a good solution. There are also some services that could be shared.
I have seen libraries such as browserify; but thats not exactly what I am looking for. I am looking for a solution similar to maven dependency in java. In java, libraries can be shared easily using maven, whereas I can't find a similar way of doing that in javascript.
Is there a way to isolate these services and give them as dependency to nodejs using npm and to angularjs using bower independently? Or what are the ways for sharing the same code between frontend and backend?
There are several ways to do this. The first is that you can make a new package which is required via bower for the front-end code and via npm for the backend code. I have several packages published to both systems.
Install with Bower -- information on how to install modules that aren't in the registry
NPM Install docs -- all the ways to install with npm (private github with auth: git+ssh://git#github.com/[org]/[repo])
Just create a new module with your shared data and install it using both package managers. Both of them allow you to install an unpublished module so if it's private data you can keep it as such.
If your front end requires require.js you can use something like amdefine to make it available to your node backend, or if you're just using legacy window code you can do something like:
var mydata = {};
if(typeof window !== 'undefined'){
window.mydata = mydata;
} else {
module.exports = mydata;
}
If you are sharing a lot of data though I highly recommend looking into browserify to write your entire codebase in commonjs and using browserify to generate your client bundle. There is a laundry list of resources about using browserify, including stuff on how to use browserify and angular together
Disclaimer - I'm still developing this approach and it's a little manual.
I did this using npm, an npm cli called pac, and bower. Pac let's me avoid using npm install in production by keeping the modules as .tgz files (committed to project in source control). With pac, when someone checks out the node project, they run pac install then npm rebuild instead of npm install.
My shared code is kept in a directory (my-module). It has both package.json and a bower.json.
My consuming node app has a package.json dependency for:
"my-module" : "x.y.z"
My consuming client has a bower.json dependency for:
"my-module" : "../relative/path/to/my-module"
When I make updates to my-module, I update my node app by:
Making a tar.gz of the contents of my-module:
tar -czvf my-module.tar.gz -C my-module
Removing the old version from the node app's node_modules
Rerunning npm install path/to/my-module-tar.gz
Rerunning pac (this makes a .tgz of node_modules/my-module)
Committing the updated pac .modules/my-module.tgz
I update my client by:
Removing the old client/bower_components/my-module
Rerunning bower install or bower update

Categories

Resources