Publish and Consume NPM Packages using GitHub Package Manager

 Hi folks,

We are used to publishing the npm packages on npmjs.com. Today, I will show how we can publish the npm packages to GitHub and the steps to use those packages.

1. Publishing Packages

Prerequisites

We need to have an account with GitHub

JavaScript native/framework based project with package.json

Add the .npmrc file to your project with the following syntax. Change the OWNER value to your GitHub account or organization name.

@OWNER:registry=https://npm.pkg.github.com

Publishing Process to GitHub

Create personal access token using the following steps

• Login to GitHub
• Go to Settings
• Navigate to "Developer Settings" -> "personal access tokens"
• Generate token with write:packages access permissions

• Open terminal in the project folder
• Execute the command to login

npm login --scope=@OWNER --registry=https://npm.pkg.github.com

• When prompted,
• Username: GitHub username
• Password: Personal access token
• Public e-mail: Your email address
• Enter the following command to publish the package

npm publish

2. Consume/Installing the packages

Prerequisites

We need to have an account with GitHub

Installation

Add the .npmrc file to your project with the following syntax. Change the OWNER value to your GitHub author or organization name.

@OWNER:registry=https://npm.pkg.github.com

Enter the full name @OWNER/package-name-version in dependencies in package.json

Install the dependencies

npm install

Note: If the organization is asking for authorization of personal access token, then you need to authorize from the personal access token section against the token for the respective organization.

Hope you will make use of GitHub for publishing the packages and consuming them with ease.

Request you to send your feedback and comments to psrdotcom@gmail.com

Ubuntu - update NPM and NodeJS

Hi folks,

Some people often confuses with NPM update vs Node.js update.

Let me clarify that, NPM (Node Package Manager) is a CLI (Command Line Interface) to manage the JS (JavaScript) packages from https://www.npmjs.com/ or any other external package managers like GitHub.

Node.js is a FrontEnd JavaScript Framework like Vue.js, AngularJS which helps to build the scalable network applications. Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

NVM (Node Version Manager) and n are command line utilities to manage and switch between Node.js versions.

When you are installed for the first time, you will be installing Node.js from https://nodejs.org/en/download/ which also installs NPM CLI utility.

But when upgrading the NPM or Node.js, it's a different story.

Update NPM

npm install -g npm

Update Node.js with Node version manager (n)

Install the n

sudo npm install -g n

Update the Node.js to stable version

sudo n stable

As of now, the stable version is 16.3.2 which includes NPM 8.1.2

Update the Node.js to current version

sudo n current

As of now, the current version is 17.4.0 with NPM 8.3.1

Check the versions

NPM

npm --version

Node.js

node --version

Hope this helps you to understand the NPM and Node.js difference along with update of individual components.

Send your comments and feedback to psrdotcom@gmail.com

 

Run local file server with NPM http-server

Hi folks,

Today i'll explian the process of making your folder as a standalone file server.

Objective

Make my folder contents browse over http

Procedure

• Install Node
• Download from official website https://nodejs.org/en/download/
• Install http-server module in node globally
• npm install -g http-server
• Open terminal/command-prompt
• Navigate to your folder
• Run the following command to start the server
• http-server .
• or simply run
• hs .
• Run from anywhere with full path of the folder
• hs C:\FileFolder
• Starting up http-server, serving .
• Available on:
• http://10.10.6.2:8080
• http://127.0.0.1:8080
• http://youripaddress:8080
• Hit CTRL-C to stop the server
• You should be able to browse your file folder contents with any of the above URLs

Hope you are able to access your file contents over the browser

Tip: Using this approach, you can share your content over intranet/internet with full control over data as read only.

After stopped the server, access to the folder is stopped.

Please send your comments and feedback to psrdotcom@gmail.com

PhoneGap Installation and running Sample Application on iOS

Pre-requisites

Softwares

•     iOS SDK

•     Xcode command line tools

•     Node.js

•     Cordova (Zip)

Setup Environment Variables

•     NODEJS_HOME

•     CORDOVA_IOS

PATH Environment Variable Update

1) Open a terminal prompt

2) Type sudo vi /etc/launchd.conf (note: this file might not yet exist)

3) Put contents like the following into the file

# Set environment variables here so they are available globally to all apps

# (and Terminal), including those launched via Spotlight.

#

# After editing this file run the following command from the terminal to update

# environment variables globally without needing to reboot.

# NOTE: You will still need to restart the relevant application (including

# Terminal) to pick up the changes!

# grep -E "^setenv" /etc/launchd.conf | xargs -t -L 1 launchctl

#

# See http://www.digitaledgesw.com/node/31

# and http://stackoverflow.com/questions/135688/setting-environment-variables-in-os-x/

#

# Note that you must hardcode the paths below, don't use enviroment variables.

# You also need to surround multiple values in quotes, see MAVEN_OPTS example below.

#

# Nodejs Installed path. By default the path is your home directory->.npm directory path

setenv NODEJS_HOME $HOME/.npm

# Choose the location where you have unzipped the cordova iOS folder

setenv CORDOVA_IOS /cordova-ios

PATH Environment Variable Update

create .bash_profile file in your home folder

Enter the following content

#!/bin/bash

export PATH=$PATH:$NODEJS_HOME:$CORDOVA_IOS/bin

Install phonegap

If you are behind a proxy please set the proxy to npm (Node.js) command

Syntax:-

(For HTTP) $ npm config set proxy http://proxy.company.com:port

(For HTTPS) $ npm config set https-proxy http://proxy.company.com:port

Run the install command

$ sudo npm install -g phonegap

$ sudo npm install -g cordova

Note: If you face any errors

• Remove the .npm directory from the home folder
• Upgrade npm (sudo npm install -g npm)
• Clear the global npm cache (sudo npm cache clear)
• Clear the user npm cache (npm cache clear)

Create Project

Syntax: phonegap create

$ phonegap create hello com.example.hello "HelloWorld"

By default the skeleton folder structure will be created.

Note: if you didn’t get the default skeleton (www, js, css folders and other files), please copy from the sample-hello-world project of phonegap to your www project folder

$ cd hello

$ cordova platform add ios

$ phonegap build ios

Adding Plugins to your project

Pre-requisites

            •           Install Git

Tip: If you are behind a proxy then please add it your configuration

Syntax: git config —global http.proxy http://proxyusername:proxypassword@server.company:port

Ex: git config —global http.proxy http://abc:123@xyz.com:8081

            •           Add git\bin to your PATH environment variable

            •           You need to download the git files from https://git-wip-us.apache.org. So make sure that the above specified URL is not blocked by your firewall

            •           Navigate to your project directory in command prompt by changing the directory

cd

Note:

If you have some issues download cordova zip (unzip cordova-ios zip) and copy it to your home directory-> ~/.cordova/lib/ios/cordova/3.2.0/

Install Plugin

Syntax: phonegap local plugin add

Ex:- phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git

Tip: If this doesn’t run then try with cordova

Syntax: cordova plugin add

Ex:- cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git

Add the Feature to config.xml (Ex: Accelerometer)

    name="Accelerometer">

        name="ios-package" value="CDVAccelerometer" />

   

Remove Plugin

Syntax: phonegap local plugin remove

Ex:- phonegap local plugin remove https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git

Tip: If this doesn’t run then try with cordova

Syntax: cordova plugin remove

Ex:- cordova plugin remove https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git

Alternative

You can install “plugman” to plug and play with plugins by following this link

Using Plugman to Manage Plugins

Note: plugman doesn’t take proxy

References

http://docs.phonegap.com/en/3.2.0/guide_platforms_ios_index.md.html#iOS%20Platform%20Guide

http://docs.phonegap.com/en/3.2.0/plugin_ref_plugman.md.html#Using%20Plugman%20to%20Manage%20Plugins

http://phonegap.com/install/

http://jjasonclark.com/how-to-setup-node-behind-web-proxy

http://teusink.blogspot.nl/2013/07/guide-phonegap-3-android-windows.html

http://docs.phonegap.com/en/3.2.0/cordova_accelerometer_accelerometer.md.html#Accelerometer

http://docs.phonegap.com/en/edge/guide_cli_index.md.html#The%20Command-Line%20Interface