|
| 1 | +## react-typescript-module |
| 2 | +This repo lets you create a module using react and typescript with minimal build configuration. |
| 3 | + |
| 4 | +### Get started |
| 5 | +* Clone this repo, remove origin and install modules |
| 6 | + * `git clone https://github.com/dumbape/react-typescript-module.git <Your Module Name>` |
| 7 | + * `cd <Your Module Name>` |
| 8 | + * `git remote remove origin` |
| 9 | + * `npm install` |
| 10 | +* Build your React Typescript module as usual in the `src` folder. |
| 11 | +* Make a separate `.ts` file which would have all the exports from the module. For convenience, an `index.ts` has been provided, however, you may make your own anywhere. |
| 12 | +* Open `rollup.config.js` and adjust the `input` parameter (by default points to sec/index.ts) so that it points to the `.ts` file containing all the exports. |
| 13 | +* Run `npm run build`. A build folder will be generated. |
| 14 | +* Open `package.json` and change `name` and `version` to your module name and version. Optionally, you may add a `description`. Point `types` to the `.d.ts` file generated in build folder, which contains all exports. Do not change `main`, `module` and `jsnext:main`. |
| 15 | +* Your module is ready to be used. |
| 16 | + |
| 17 | +### Test the module |
| 18 | +* Create a new react project (with or wihout typescript). |
| 19 | + * `npx create-react-app testapp && cd testapp` OR |
| 20 | + * `npx create-react-app testapp --typescript && cd testapp` |
| 21 | +* Install the created module. |
| 22 | + * `npm install <Path to the root folder of your module>` |
| 23 | +* Try using your component as any other module by including it in any `.tsx` or `.jsx` file. |
| 24 | + * `import { <Your Component> } from 'your-module'` |
| 25 | + |
| 26 | +### Publish the module |
| 27 | +* The module is ready to be published for react users (with and without typescript!). |
| 28 | +* Login to npm and publish |
| 29 | + * `npm login` |
| 30 | + * `npm publish` |
| 31 | + |
| 32 | +### Contribute |
| 33 | +You are free to raise issues and PR's to improve the repo and help people build modules with ease :) |
| 34 | + |
| 35 | + |
0 commit comments