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

Module Bundel

-
package.,json {    "name" :  " moduletutorial " ,    "version" :  " 1.0.0 " ,    "description" :  " creating module " ,    "main" :  " dom.js " ,    "scripts" : {      "test" :  " echo  \" Error: no test specified \"  && exit 1 " ,      "start" :  " webpack "   },    "author" :  "" ,    "license" :  " ISC " ,    "dependencies" : {      "webpack" :  " ^4.39.3 " ,      "webpack-cli" :  " ^3.3.8 "   } } webpack.config.js var   path   =   require ( " path " ); module . exports   =  {     entry: ' ./app.js ' ,     output: {         path:  path . resolve (__dirname),         filename:  ' main.js '     },     mode:  ' development ' }
Read more

Power of async and Promise

-
///////////////////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////// Async //////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////////////////////// // const promise = fetch('https://jsonplaceholder.typicode.com/todos') // promise // .then(res => res.json()) // .then(data => console.log(data)) // .catch(err => console.log(err)) const getBlogs = async ( name ) => { const fruits = { " one " : " One 1 " , " two " : " Two 2 " , " three " : " Three 3 " } await delay ( 2000 ); return Promise . resolve ( fruits [ name ]); } // for small const makeMe = async () => { try {
Read more