How to use modified node module using github branch? - ruby-on-rails

I'm using the rc-slider component in my application and had to
add one feature to meet my needs.
I forked the main repository and pushed my changes to this branch.
In the application, I changed the package.json as below and ran the npm install again:
"rc-slider": "Rodrigora/slider#add-label"
Nothing changed. Seems that npm doesn't update the dependencies.
So, I removed the node_modules and rails cache folder and ran the install command again:
rm -rf node_modules/
rake tmp:cache:clear
npm install
Now, I have this error:
events.js:142
throw er; // Unhandled 'error' event
^
Error: Cannot find module 'rc-slider' from '/Users/rodrigora/project/app/assets/javascripts'
NPM can't find the rc-slider when I using the modified branch.
NPM does not update the dependencies only changing the package.json file?
Should I run some build command to install my branch code?

In npm docs:
"dependencies": {
"rc-slider": "git://github.com/Rodrigora/slider.git#add-label"
}
Also you can use
npm install git://github.com/Rodrigora/slider.git#add-label --save
The above command will add that dependency in your package.json.
Edit:
I miss understood your question. I tried the below fix in the repo that you mentioned and it worked. (you should also have the dependency setup like above)
It is a react project. It is compiled and published to NPM.
So, if you want to install it directly from your github fork, you should make some changes to package.json
Before making changes in package.json install rc-tools globaly:
sudo npm install rc-tools -g
Change the files that should be included:
"files": [
"index.js",
"assets",
"src"
]
and add postinstall script in scripts:
"postinstall": "rc-tools run compile"
Then try installing from github after making these changes in that branch.

You can use git repositories as NPM packages:
"rc-slider": "git://github.com/Rodrigora/slider#add-label"

Related

How to install NPM end-user packages on NixOS?

Is there a way to install NPM command line tools on NixOS?
[root#ip-xxx-xxx-0-27:~/teros/ntrs-cli]# sudo npm i -g typescript
npm WARN checkPermissions Missing write access to /nix/store/rhikjv5vlpa6vq4qkrszinwsaz1mda7p-nodejs-8.15.1/lib/node_modules
npm ERR! path /nix/store/rhikjv5vlpa6vq4qkrszinwsaz1mda7p-nodejs-8.15.1/lib/node_modules
npm ERR! code EROFS
npm ERR! errno -30
npm ERR! syscall access
npm ERR! rofs EROFS: read-only file system, access '/nix/store/rhikjv5vlpa6vq4qkrszinwsaz1mda7p-nodejs-8.15.1/lib/node_modules'
npm ERR! rofs Often virtualized file systems, or other file systems
npm ERR! rofs that don't support symlinks, give this error.
I assume because it's read-only, because I did run:
chown -R `whoami` nix/store/rhikjv5vlpa6vq4qkrszinwsaz1mda7p-nodejs-8.15.1
as an aside if someone knows how to install Node.js version 11 or 12 on nixos that'd be great.
Firstly, please undo the permissions change (chown) you made. You should NEVER change the permissions of files in the Nix store (/nix/store).
To install NPM packages on NixOS use the corresponding Nix package, instead of using npm -g .... NPM packages are under the nodePackages "namespace".
For example, to install typescript (tsc) edit /etc/nixos/configuration.nix:
...
environment.systemPackages = with pkgs; [
...
nodePackages.typescript;
]
...
Then use nixos-rebuild switch to "install" the package.
You can install Node.js the same way. Use nix search nodejs to see the various versions you can install.
Instead Edit ~/.npmrc so that it tells npm to install and find "global" packages in your home folder instead of the root location:
prefix=~/.npm-packages
now any time you run npm i -g <some-package> you will see that it will be installed inside of ~/.npm-packages.
Now in your shell rc file (f.e. .bashrc or .zshrc or similar), you'll need to update your PATH to include executables from the new location:
### Add NPM executables to your PATH so that they are available as commands:
export PATH="$HOME/.npm-packages/bin:$PATH"
Often it is more convenient to manage ephemeral dependencies outside of the system-level package manager.
If you use something like n or nvm to manage specific node versions, you can do a similar thing by managing them in your home folder.
npm config set prefix '~/mutable_node_modules'
This thread should be helpful:
https://github.com/NixOS/nixpkgs/issues/3393#issuecomment-50330167
https://github.com/NixOS/nixpkgs/issues/3393#issuecomment-187510024
You can also install them with the usual npm -i..., just without the -g (global) paramater.
looks like things may have changed a bit.
on fish shell with node v16.15.0 and nix (Nix) 2.8.1. I just had to add fish_add_path -g $HOME/.node_modules/bin to my config.fish then npm install -g <package>.

Correct deployment script for Azure Git backed continuous Deployment

I have a ASP.Net 4.5 MVC application which uses Angular 1.5. The JS code is Typescript and a post build action builds the js code and deploys it to the folder where my application refers to.
I have a Slot on my azure web app which is backed my gitlab repo. Committing to the repo, triggers the deployment, however the post deployment build frequently seems to have issues when a bower/npm or typings library is updated (which is resolved by manually clearing the folder via the kudu console). Does someone have an example of a deploy.cmd script which does the equivalent of
npm install
typings install
at the correct point in the pipeline so that the files get deployed correctly.
I want to start scratch with a new slot, and to get the existing slot to work in the past i had to manually install typings for example "npm install typings --global" in order to get the build to work without a typings error.
Update Output Below
I'm guessing that the errors below are due to azure running typescript 1.6 compiler over reference files which need typescript > 1.6.
My csproj has <TypeScriptToolsVersion>2.0</TypeScriptToolsVersion>
(ive removed my files from the compile output, but the _all.d.ts file does reference the errored files below
CompileTypeScript:
D:\Program Files (x86)\Microsoft SDKs\TypeScript\1.6\tsc.exe --sourcemap --target ES5 --noEmitOnError "REMOVED MY TYPESCRIPTFILES" "D:\home\site\repository\mymvcproject\app\src\_all.d.ts"
D:\home\site\repository\mymvcproject\typings\globals\angular\index.d.ts(1824,32): error TS1110: Build: Type expected. [D:\home\site\repository\mymvcproject\mymvcproject.csproj]
D:\home\site\repository\mymvcproject\typings\globals\angular\index.d.ts(1824,50): error TS1005: Build: ']' expected. [D:\home\site\repository\mymvcproject\mymvcproject.csproj]
D:\home\site\repository\mymvcproject\typings\globals\angular\index.d.ts(1824,58): error TS1005: Build: ',' expected. [D:\home\site\repository\mymvcproject\mymvcproject.csproj]
D:\home\site\repository\mymvcproject\typings\globals\angular\index.d.ts(1824,59): error TS1136: Build: Property assignment expected. [D:\home\site\repository\mymvcproject\mymvcproject.csproj]
D:\home\site\repository\mymvcproject\typings\globals\angular\index.d.ts(1941,1): error TS1128: Build: Declaration or statement expected. [D:\home\site\repository\mymvcproject\mymvcproject.csproj]
Done Building Project "D:\home\site\repository\mymvcproject\mymvcproject.csproj" (Build;pipelinePreDeployCopyAllFilesToOneFolder target(s)) -- FAILED.
FINAL UPDATE
After the typescript team finally generated a version of typescript 2.* which could be installed on Azure, and then the Kudu team deployed it. Now the whole process works! the note from below about using
"preinstall": "npm install typescript -g && npm install typings -g"
Was the other part of the solution!
According to your requirement, you could follow the steps below to achieve your purpose.
Create a deployment script
You could log in to KUDU tool (https://.scm.azurewebsites.net/), click "Tool" > "Download deployment script". Also, you could leverage azure-cli to generate the script. For more details about how to generate deployment script via azure-cli, you could refer to this tutorial.
Customize the deployment script
For using NPM to manage your packages, you could add the following scripts in your package.json file.
"scripts":{
"preinstall": "npm install typescript -g && npm install typings -g"
}
Then, you need to add the following scripts to the deploy.cmd file.
IF EXIST "%DEPLOYMENT_SOURCE%\package.json" (
pushd "%DEPLOYMENT_SOURCE%"
echo installing npm package
call :ExecuteCmd npm install --production
IF !ERRORLEVEL! NEQ 0 goto error
popd
)
Or you could add the following scripts to install typescript and typings directly via command line.
echo Installing typescript and typings
call npm install typescript -g && npm install typings -g
IF !ERRORLEVEL! NEQ 0 goto error
Note: The .deployment, deploy.cmd files need to be placed in the root directory of your solution. You could refer to this sample project for details.

Is the Bower command missing from project?

I have a deploy.cmd script that I built using these steps. It is being used to package a project up for deployment to Azure. In it there is this line:
IF EXIST "%DEPLOYMENT_TARGET%\bower.json" (
pushd "%DEPLOYMENT_TARGET%"
call :ExecuteCmd .\node_modules\.bin\bower install
IF !ERRORLEVEL! NEQ 0 goto error
popd
When I test the script locally, it fails because there is no bower command in the .bin directory. I have installed bower using -g and have used it to install project packages. But I can't figure out how it's supposed to make it into this folder.
It'll make it to that folder if you run npm install bower without -g. -g is meant to install tools globally to be available anywhere on your commandline, while not adding -g will install it locally in the node_modules folder

Managing bower dependencies with ionic

After starting with a new ionic app, I can see at bower.json that comes with ionic is in devdependencies. Why is it a devdependency and not a normal dependency?
"devDependencies": {
"ionic": "driftyco/ionic-bower#1.0.0-rc.0"
},
Thanks, I feel confused right now
having devDependencies gives you the opportunity to simplify the steps that drive you from the source files (a git clone of the project) to the production ready app
when you don't need to make changes and (develop) the application, you could just run
bower install --production
or
npm install --production
they work the same
bower install options
-F, --force-latest: Force latest version on conflict
-p, --production: Do not install project devDependencies
-S, --save: Save installed packages into the project’s bower.json dependencies
-D, --save-dev: Save installed packages into the project’s bower.json devDependencies
-E, --save-exact: Configure installed packages with an exact version rather than semver
bower documentation
npm install options
By default, npm install will install all modules listed as
dependencies. With the --production flag (or when the NODE_ENV
environment variable is set to production), npm will not install
modules listed in devDependencies.
npm documentation
This way you take less time to ship the app and don't waste bandwidth downloading stuff you won't need.
Given that, to me, the choice of listing ionic as devDependecy is a poor one: it implies that I could take advantage of this choice to get ready the app for execution this way:
git clone my-project
git cd my-project
npm install --production # ionic not installed here
ionic state restore
ionic build ios
Now, if you ignore the content of /lib folder in your sources, this should not work, and if it works because the ionic-cli does some more checks to save your ass, I think this is unclear.
From what I understand, dependencies are required to run, and devDependencies are only for development, like minification, unit tests, etc.
Both will install when you do npm install but only dependencies will install when you do npm install $package, unless you add the --dev option

How to install latest (untagged) state of a repo using bower?

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]"

Resources