Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/atapas/react-package-publisher
This is a project to help developers build, test and publish a react component to Node Package Magaer(npm).
https://github.com/atapas/react-package-publisher
node nodejs npm npm-package publish react reactjs
Last synced: 24 days ago
JSON representation
This is a project to help developers build, test and publish a react component to Node Package Magaer(npm).
- Host: GitHub
- URL: https://github.com/atapas/react-package-publisher
- Owner: atapas
- License: mit
- Created: 2020-07-12T12:22:40.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-01-06T11:18:11.000Z (almost 2 years ago)
- Last Synced: 2024-09-07T08:53:24.554Z (2 months ago)
- Topics: node, nodejs, npm, npm-package, publish, react, reactjs
- Language: JavaScript
- Homepage: https://tapasadhikary.com
- Size: 503 KB
- Stars: 11
- Watchers: 1
- Forks: 1
- Open Issues: 9
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# react-package-publisher
`react-package-publisher` is a toolkit for reactjs developers to build, test and publish a react component to the [Node Package Manager(npm)](https://www.npmjs.com/). This project contains important commands in a script file to build, test and publish a package.
> [react-show-greeting](https://www.npmjs.com/package/react-show-greeting) is reactjs based package published using the `react-package-publisher`. This is an example package to greet you once you type-in your name.
# Usage
- Fork or clone this repo.
- Change the directory to, react-package-publisher
- Edit the `package.json` with your package name, version, author, license, dependencies, devDependencies etc. Please note, the `peerDependencies` are already set for a specific version of `react` and `react-dom`. Please feel free to change the versions suitable to your need. If you are new to the npm dependency management, please [read this](https://blog.greenroots.info/npm-dependency-handbook-for-you-ckcg56tei003ejhs16wap1t8r).
- Create your component file and write the component code.
- Run the `build.sh` file. Please note, use a unix based terminal(example, GitBash) to run the `build.sh` file.
```shell
./build.sh
```
# What is in `build.sh` file?
The `build.sh` file is the main file that helps in building, packaging and publishing your react component to the npm. It helps automating many steps that are usually need to execute line by line and time consuming. It contains commands to faciliate the followings,
- Check Node, NPM and Yarn Versions.
- Remove the existing `dist` folder. This folder will be generated at the compilation step automatically.
- Remove the existing `index.js` file. This file will be generated at the compilation step automatically.
- Perform `yarn install`(Dependency Management).
- Build Components and creates `index.js` file and `dist` folder.
- Copy other required files like, `README.MD`, `*.scss` etc files to the `dist` folder.
- Create a tarball npm for local testing.
- Login and Publish. Here are 2 ways to login
- 1. Using Intercative mode(Default) => npm login will ask for username, password and email.
- 2. Using non interactive mode => Edit the file to comment the above option and uncomment the line starts with `npm-login-noninteractive`. Please edit the required parameter values like, , and . Please install [npm-login-noninteractive](https://www.npmjs.com/package/npm-login-noninteractive) globally as a depenency to use this option.
# Many Thanks to all the `Stargazers` who has supported this project with stars(⭐)
[](https://github.com/atapas/react-package-publisher/stargazers)
# Further Read
Here is the [step-by-step turorial](https://blog.greenroots.info/toolkit-for-publishing-your-react-component-to-the-node-package-managernpm-ckck8x54w00eo4as1eaoqa4ut) about how to use this toolkit.