# @dynrl/create-react-comp-scripts > Custom scripts for [Create React App](https://github.com/facebook/create-react-app) for generating React component projects written in TypeScript. Latest version **0.1.2-alpha06** (published 2018-09-18) · MIT license · 0 weekly downloads ## Install ```sh npm install @dynrl/create-react-comp-scripts pnpm add @dynrl/create-react-comp-scripts yarn add @dynrl/create-react-comp-scripts bun add @dynrl/create-react-comp-scripts ``` Provides the command `react-scripts`. ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.1.2-alpha06 | | Published | 2018-09-18 | | First published | 2018-09-05 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 43 | | Unpacked size | 21.3 KB | | Known vulnerabilities | 0 (+3 in 2 direct dependencies) | | Install scripts | no | | Author | rturnquist | | Maintainers | dschomburg, eibbordraw, max.drl, rturnq | ## Links - npm: https://www.npmjs.com/package/@dynrl/create-react-comp-scripts - npm.io page: https://npm.io/package/@dynrl/create-react-comp-scripts ## Dependencies (43) - [jest](https://npm.io/package/jest.md) ^23.4.1 - [chalk](https://npm.io/package/chalk.md) ^2.4.1 - [husky](https://npm.io/package/husky.md) ^0.14.3 - [react](https://npm.io/package/react.md) ^16.4.1 - [enzyme](https://npm.io/package/enzyme.md) ^3.3.0 - [rollup](https://npm.io/package/rollup.md) 0.64.1 - [tslint](https://npm.io/package/tslint.md) ^5.11.0 - [ts-jest](https://npm.io/package/ts-jest.md) ^23.0.1 - [fs-extra](https://npm.io/package/fs-extra.md) ^7.0.0 - [prettier](https://npm.io/package/prettier.md) ^1.13.7 - [react-dom](https://npm.io/package/react-dom.md) ^16.4.1 - [babel-core](https://npm.io/package/babel-core.md) ^6.26.3 - [typescript](https://npm.io/package/typescript.md) 3.0.1 - [@types/jest](https://npm.io/package/@types/jest.md) ^23.3.0 - [@types/node](https://npm.io/package/@types/node.md) ^10.5.2 - [lint-staged](https://npm.io/package/lint-staged.md) ^7.2.0 - [@types/react](https://npm.io/package/@types/react.md) ^16.4.6 - [tslint-react](https://npm.io/package/tslint-react.md) ^3.6.0 - [@types/enzyme](https://npm.io/package/@types/enzyme.md) ^3.1.12 - [babel-runtime](https://npm.io/package/babel-runtime.md) ^6.26.0 - [react-dev-utils](https://npm.io/package/react-dev-utils.md) ^5.0.1 - [@storybook/react](https://npm.io/package/@storybook/react.md) ^4.0.0-alpha.20 - [@types/react-dom](https://npm.io/package/@types/react-dom.md) ^16.0.6 - [babel-preset-env](https://npm.io/package/babel-preset-env.md) ^1.7.0 - [@storybook/addons](https://npm.io/package/@storybook/addons.md) 4.0.0-alpha.20 - [jest-dot-reporter](https://npm.io/package/jest-dot-reporter.md) ^1.0.6 - [rollup-plugin-url](https://npm.io/package/rollup-plugin-url.md) ^1.4.0 - [babel-preset-react](https://npm.io/package/babel-preset-react.md) ^6.24.1 - [react-test-renderer](https://npm.io/package/react-test-renderer.md) ^16.4.1 - [rollup-plugin-babel](https://npm.io/package/rollup-plugin-babel.md) ^3.0.7 - [rollup-plugin-tslint](https://npm.io/package/rollup-plugin-tslint.md) ^0.1.34 - [rollup-plugin-commonjs](https://npm.io/package/rollup-plugin-commonjs.md) ^9.1.3 - [tslint-config-prettier](https://npm.io/package/tslint-config-prettier.md) ^1.13.0 - [@types/storybook__react](https://npm.io/package/@types/storybook__react.md) ^3.0.8 - [enzyme-adapter-react-16](https://npm.io/package/enzyme-adapter-react-16.md) ^1.1.1 - [awesome-typescript-loader](https://npm.io/package/awesome-typescript-loader.md) ^5.2.0 - [rollup-plugin-typescript2](https://npm.io/package/rollup-plugin-typescript2.md) 0.16.1 - [rollup-plugin-node-resolve](https://npm.io/package/rollup-plugin-node-resolve.md) ^3.3.0 - [@storybook/addon-storyshots](https://npm.io/package/@storybook/addon-storyshots.md) 4.0.0-alpha.20 - [tsconfig-paths-webpack-plugin](https://npm.io/package/tsconfig-paths-webpack-plugin.md) ^3.2.0 - [rollup-plugin-peer-deps-external](https://npm.io/package/rollup-plugin-peer-deps-external.md) ^2.2.0 - [babel-plugin-require-context-hook](https://npm.io/package/babel-plugin-require-context-hook.md) ^1.0.0 - [@types/storybook__addon-storyshots](https://npm.io/package/@types/storybook__addon-storyshots.md) ^3.4.3 ## Recent versions - 0.1.2-alpha06 (latest) — 2018-09-18 - 0.1.2-alpha05 — 2018-09-18 - 0.1.2-alpha04 — 2018-09-06 - 0.1.2-alpha03 — 2018-09-05 - 0.1.2-alpha02 — 2018-09-05 - 0.1.2-alpha01 — 2018-09-05 - 0.1.1 — 2018-09-05 ## README # create-react-comp-scripts Custom scripts for [Create React App](https://github.com/facebook/create-react-app) for generating React component projects written in TypeScript. ## Getting Started You must have Create React App installed globally see [here](https://gist.github.com/gaearon/4064d3c23a77c74a3614c498a8bb1c5f#file-instructions-md) for documentation. _Note:_ These steps will assume your new package is named `my-component`. 1. `create-react-app my-component --scripts-version @dynrl/create-react-comp-scripts` 2. `cd my-component` 3. `yarn start` 4. Launch a browser and navigate to `http://localhost:9000` ## Available Scripts * `yarn start` - Start the Stroybook server for development * `yarn build` - Transpile to javascript in preperation for publishing * `yarn test` - Run your tests using Jest * `yarn run format` - Format your source files with Prettier * `yarn run export` - Build a standalone Storybook for hosting a demo ## Developing Development is handled through [Storybook](https://storybook.js.org/) which allows you to write stories which showcase your component for various use-cases. See [here](https://storybook.js.org/basics/writing-stories/) for more information abour writing stories. To launch the Storybook server simply run `yarn start` then open a browser and navigate to `http://localhost:9000`. The Storybook server has hot-reloading enabled so changing your component or story can be done while the server is running and the changes will be reflected in the browser. Stories should be written in TypesScript and the file should end in `.story.tsx` and be placed in the `src` directory. It is recommended you place them next to your component with the same name as the component (ex. `/src/hello/Hello.tsx` has the story `/src/hello/Hello.story.tsx`). ## Testing Testing is performed using [Jest](https://jestjs.io) and [Enzyme](http://airbnb.io/enzyme/). Tests should be written in TypeScript and the file should end in `.test.ts(x)` or `.spec.ts(x)`. Like stories, it is recommended to place the tests next to your component using the same name. To test simply run `yarn test` ## Building Your TypeScript code will be transpiled to JavaScript (for distribution through npm) using [Rollup](https://rollupjs.org). This must be done before publishing. To build simply run `yarn build` ## Formatting TODO ## Export Demo TODO --- _Source: https://npm.io/package/@dynrl/create-react-comp-scripts · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._