Create React Component and publish to NPM

-

Create React Component and publish to NPM:



//////////////Create React LibRary///////////////
//////////////Create React LibRary///////////////
//////////////Create React LibRary///////////////

1.) install 
    cmd:    npm install -g create-react-library

2.) Create Lib Config 
    cmd:    create-react-library

3.) Now u can see Example Folder(Dummy React app where u can test your plugin)
    Go that folder cd ./Example
    In One Tab
    cmd:    npm start

4.) In Another Tab
    got to main folder where u can see package.json files
    cmd:    npm start

5.) for upload on github

    Note:   create repository in github without README.md files den do following step

            In json file chagnes folowing things based on your repository
            {
                ....
                "name": "cui-autoselect-react-ra-lib",
                "version": "1.0.1",
                "description": "Auto select dropdown with various functionality",
                "author": "Author Name",
                "license": "MIT",
                "repository": "https://github.com/profileName/repositoryName.gitb",
                ....
            }
            
            i.)    git init
            ii.)   git add README.md
            iii.)  git commit -m "first commit"
            iv.)   git remote add origin https://github.com/profileName/repositoryName.git
            V.)    git push -u origin master
    
    cmd:    npm run deploy


6.) for publish on npm     
    cmd:    npm publish


Comments

Post a Comment

Popular posts from this blog

Service worker fetch all data

-
main.js // Make Sure service work is supported if ( ' serviceWorker ' in navigator ){ console . log ( ' Service work is supported ' ); window . addEventListener ( ' load ' , () => { navigator . serviceWorker . register ( ' ./sw_cached_pages_V2.js ' ) . then ( reg => console . log ( " Service Worker: Registered " )) . catch ( err => console . log ( ` Service Worker: Error : ${ err } ` )) }) } sw_cached_pages_V2.js // Service Worker Fetch all data from sites const cacheName = " v2 " ; // call install Events self . addEventListener ( ' install ' , function ( event ) { }); // call Activate Events self . addEventListener ( ' activate ' , e => { console . log ( " ServiceWorker: Activated " ); e . waitUntil ( caches . keys (). then ( cacheNames => { return Promise . all ( ...
Read more

Angular 4 5 6 Interview Question

-
Angular 4-5-6 Interview Question /////////// Angualr 2/4/5/6/7 Interview Question /////////// 1.) What are the new features of Angular 4?     Revamped *ngIf and *ng For     Router ParamMap     TypeScript Compatibility     Animations Package     Dynamic Components     Angular Universal     Smaller and Quick     View Engine – AOT Compilation     Flat ES Modules (Flat ESM / FESM)     Source Maps for Templates 2.) Different between  Observable or Promise     Promise:         -A Promise handles a single event when an async operation completes or fails.         -usually only use with async data return         -not easy to cancel     Observable:         -are cancellable         -are retriable by nature such as retry and retryWhen     ...
Read more

Javascript Prototype to Class

-
Prototype /**         * Leve 0         */          function   Animal ( name ) {              let   obj   =  {};              obj . name   =   name ;              obj . myName   =   function () {                  console . log ( obj . name )             }              return   obj         }          let   dog   =   Animal ...
Read more