We Keep Coding

How to test a monorepo locally?

I got a big project that is a monorepo consisting of multiple scripts and libraries, its structure is the following:
package.json // "private":true
\packages
\comp1
\package.json // an actual component
\comp2
\package.json // an actual component
\comp3
\package.json // an actual component
I've made a monorepo.tgz using yarn pack.
Then I made a test app whose package.json look like this:
"scripts": {
// this is a script in one of the monorepo's components
"start": "ui-build --bundle --watch -p 3000"
}
"dependencies": {
"comp1": "../monorepo/monorepo.tgz",
"comp2": "../monorepo/monorepo.tgz",
"comp3": "../monorepo/monorepo.tgz",
...
but its not working, when I run start its complaining that ui-build: command not found.
How can I test this monorepo locally to simulate a published npm package as closely as possible?

Using npm link (or yarn link), you can 'install' the packages from your local development environment.
To do this, you first run npm link in the directory of the package you want to install, so in \packages\comp1. Then in your testapp, run npm link comp1. This will install your package. Repeat for any others you want to install.
More info:
https://docs.npmjs.com/cli/v6/commands/npm-link
https://classic.yarnpkg.com/en/docs/cli/link/

To import a file directly without using npm link or yarn link you have to prepend the path with file:. And I believe you would have to pack each file, but you can link directly to the path without packing it as well. Make sure to build it if you are linking directly to the local package folder.
For your example:
"comp1": "file:../monorepo/comp1.tgz",
"comp2": "file:../monorepo/comp2.tgz",
"comp3": "file:../monorepo/comp3.tgz",
or
"comp1": "file:../path/to/monorepo/packages/comp1",
"comp2": "file:../path/to/monorepo/packages/comp2",
"comp3": "file:../path/to/monorepo/packages/comp3",

After some research I've found that https://verdaccio.org/ is the best tool to test a library without deploying to an npm repository

npm install from a git repo leaves a pretty blank package?

I am using working from this github issue and it says to use a temporary github fork until a pull request is merged in another repo....cool.
I try to add the github fork to my project dependencies by doing this...
"reactstrap": "git+https://github.com/jameswomack/reactstrap.git",
in the package.json file and when I do a npm install everything goes according to plan, but then I get failures with my project not being able to find reactstrap...
When I go to inspect my node_modules I can see that the reactrap directory is pretty empty with only the LICENSE, README and package.json files...
What am I missing here?

The package.json file of the repository contains these lines:
"files": [
"LICENSE",
"README.md",
"CHANGELOG.md",
"lib",
"dist"
]
This is the list of files and directories to include in the npm package. As you can see, the actual JavaScript files will be located in the lib and dist directories.
The problem is that these directories are not checked into the Git repository, but created by a build, when you run npm run build.
A workaround that I would try: run the build, commit and push the generated files to your fork on GitHub. After that, installing the dependency the way you do it should give you the desired result.
However, if your goal is simply to test if your changes on a local fork of reactstrap work by including it as a dependency of a demo project, there is a better way: use npm link.
It works like this:
in the root of your local clone of your reactstrap fork, execute the command npm link
in the root of your demo project that uses reactstrap as dependency, execute the command npm link reactstrap
Any changes you then do to your reactstrap fork will be available in your demo project immediately.

how to include a private local file in javascript project using bower

i want to include a custom file as one of the bower dependency.
I am have the following bower.json
{
"name": "xyz",
"version": "0.0.0",
"dependencies": {
"sass-bootstrap": "~2.3.0",
"requirejs": "~2.1.4",
"modernizr": "~2.6.2",
"jquery": "~1.9.1",
"beautify": "file:/path/to/beautify.js"
},
"devDependencies": {}
}
But when i do bower install
it gives error :
bower beautify#* ENOTFOUND Package file:/path/to/beautify.js not found
however when i open the same path in browser i get the right file.
I have also checked the case sensitive of the path.
Now can any one tell me what error i am doing? Is there any thing wrong with the syntax?
Also tell me what if i want to add the same via bower cache. Where the global bower cache is stored in mac? And how can we register the url of private package so that i just need to put name of the package in bower.json and bower finds the file from the cache?

The code below didn't work for me using Bower 1.2.8 on Ubuntu.
"beautify": "/path/to/beautify.js"
What did work was using: "beautify": "./path/to/beautify.js". This way the path is pointing to the file relative from the directory where bower.json resides.

It should be just /relative/path/to/beautify.js. No 'file:/'.
"beautify": "/path/to/beautify.js"

If you have bower installed you can do this from the commandline
bower install ../beautify.js -S
Assuming the local repo is a directory next to your current directory. This is just a testing approach and should be an available repo for general use
EDIT
It looks like you also need to tag your repo so you will pick up the latest changes too
git tag v0.0.2

How to make requirements.txt-like file with bower?

I've started working with bower, and it seems really helpful. I come from a python background, and so I'm used to having virtualenv and requirements.txt.
Since I'd rather not store all my dependencies in source control if I can help it, I was wondering, how can I create a file like requirements.txt with bower?

After poking around a bit more, I have the solution.
bower uses a file called bower.json (formerly component.json) which is similar to a Gemfile or requirements.txt.
It can be created manually, and will look something like this...
{
"name": "<app name, defaults co current folder name>",
"version": "0.0.0",
"dependencies": {
"backbone": "~0.9.10",
"underscore": "~1.4.3"
}
}
However, the piece that I was missing was to include the --save flag when installing packages in bower:
bower install <package_name> --save
Unfortunately, I do not believe there is a way to set this behaviour by default using the .bowerrc file.
As an added tidbit, once you have a bower.json file, installing your dependencies is as simple as running bower install.

How to register a local git package in Bower?

How can I register a local git package in bower?
My current component.json is as follows
{
"name": "myproject",
"version": "1.0.0",
"dependencies": {
"jquery": "1.8.0",
"twitter/bootstrap": "2.1.1"
}
}
However I also would like to add a package I have created at C:/mypackage which is a git repository with versions tagged.
When I do bower install --save C:/mypackage it properly adds it to project but it doesn't add it to my component.json.
I am trying bower register mypackage C:/mypackage but it keeps giving me
bower error Incorrect format
What am I doing wrong?

Option 1: Public Bower registration
Bower is built mostly to share public (client-side) code in a "non-opinionated" manner. The primary use case, then, is to have a publicly accessible repository (on GitHub) that is registerd with a name and git repository url. I just did this myself:
bower register linksoup git://github.com/automatonic/linksoup
This is just telling the bower server that when you install linksoup to go and grab the code at the git://github.com/automatonic/linksoup repository, and put it in the local project's component directory.
If this is what you want to do, then just set up a repository on github/etc., push your code there, and then register with the resulting repository info.
Option 2: Private dependency
There are many reasons not to post your code at a publicly accessible repository. It may not be open source, etc. if your mypackage code is not meant to be public, then you should probably not be registering it on the public bower server... Further, even if you could register a local directory, it would only work on your machine...which defeats the purpose of sharing the code via bower.
If you just want to have bower manage a local, private dependency, then I am going to riff off of blockhead's solution:
{
"name": "myproject",
"version": "1.0.0",
"dependencies": {
"jquery": "1.8.0",
"twitter/bootstrap": "2.1.1",
"mypackage": "file:///path/to/mypackage/.git"
}
}
This is just saying that myproject needs mypackage, and to use git clone to retrieve it. My guess is that this can use anything git can understand (including local repositories). But you should note that this may run into problems for anyone else working on this code that cannot access your local path.
Best Guess
It looks to me as if you may have assumed that bower register was a local operation (telling bower how to find a dependency via some sort of local registry). As far as I can tell, this is only a remote and public registration, which is why this is unsupported.
You may also be looking for a way to do something like a link operation with npm. That is, work on a dependency module without always having your dev cycle include a publish.
A little detail about how many people are involved and what you were trying to accomplish would facilitate a more targeted answer.

You can add any git repository as follows:
{
"name": "myproject",
"version": "1.0.0",
"dependencies": {
"jquery": "1.8.0",
"twitter/bootstrap": "2.1.1",
"myrepo":"git://myrepo.com/myrepo"
}
}

You can use bower link:
The link functionality allows developers to easily test their packages.
Linking is a two-step process.
Using bower link in a project folder will create a global link.
Then, in some other package, bower link <pkg> will create a link in the components folder
pointing to the previously created link.
This allows to easily test a package because changes will be reflected immediately.
Please note that bower will not fetch the linked package dependencies.
Bower will overwrite the link when installing/updating.

The big idea with bower is to easily share your projects' dependencies. So using local repo should be limited to testing.
Once you understand that, you should know that it is not –strictly– necessary to register your package in order to use it as a dependency.
This is due to the fact that bower depencency can specify either a version, a folder or a package. So you can use local repository.
Define as bower package
First you will need to define your dependency as a bower package:
# create the bower package
cd /path/to/you-need-me
bower init
# answer questions…
Add as project dependency
Then in your main project, the one that need the you-need-me dependency, edit bower.json file to add (or expand):
"dependencies": {
…
"you-need-me": "file:///path/to/you-need-me/.git/"
"you-need-me-windows": "C:/path/to/you-need-me-windows/.git/"
}
So you don't give a version, but an local git endpoint, i.e. the subdirectory .git/.
Install dependency
In the man project install bower dependencies with:
cd /path/to/main-project/
bower install
Failure
bower you-need-me#* ENOTFOUND Package /path/to/you-need-me/ not found
Check again your path and that you point to the .git/ directory of your dependency.
Success
You should get something like:
bower you-need-me#* not-cached file:///path/to/you-need-me/.git/#*
bower you-need-me#* resolve file:///path/to/you-need-me/.git/#*
bower you-need-me#* checkout master
bower you-need-me#* resolved file:///path/to/you-need-me/.git/#b18c753c6f
bower you-need-me#* install you-need-me#b18c753c6f
Write a blog entry about that: Testing bower.json locally before registering package.