{"_id":"@aureliencabirol/new-component","_rev":"2-c79b1cf5e45a1fd6e1975b97b8d2843f","name":"@aureliencabirol/new-component","dist-tags":{"latest":"6.0.2"},"versions":{"6.0.0":{"name":"@aureliencabirol/new-component","version":"6.0.0","description":"CLI for creating new React components","homepage":"https://github.com/AurelienWebnation/new-component","repository":{"type":"git","url":"git+https://github.com/AurelienWebnation/new-component.git"},"bugs":{"url":"https://github.com/AurelienWebnation/new-component/issues"},"main":"src/index.js","keywords":["react","reactjs","cli","component","boilerplate"],"author":{"name":"Joshua Comeau"},"license":"MIT","bin":{"new-component":"src/index.js"},"dependencies":{"chalk":"4","commander":"10","prettier":"2.8.4"},"scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_id":"@aureliencabirol/new-component@6.0.0","_integrity":"sha512-+b5AYnXaaVn6VxmlKx4WxD9cQ87UrG+garjmox6y57znlRvCyj/m/QZdwTH/46o9ETKD8yq538ASTEQm118HGw==","_resolved":"/tmp/06027ee57a440a87efebffd213a8c3f4/aureliencabirol-new-component-6.0.0.tgz","_from":"file:aureliencabirol-new-component-6.0.0.tgz","_nodeVersion":"18.17.1","_npmVersion":"9.6.7","dist":{"integrity":"sha512-+b5AYnXaaVn6VxmlKx4WxD9cQ87UrG+garjmox6y57znlRvCyj/m/QZdwTH/46o9ETKD8yq538ASTEQm118HGw==","shasum":"0dfd911fcf1a83f41de3a34d7bcf19aabf0192ca","tarball":"https://registry.npmjs.org/@aureliencabirol/new-component/-/new-component-6.0.0.tgz","fileCount":15,"unpackedSize":86954,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCA3lDn73xb0PFDQGaOTrilQZkQWCgll/OyEx2Gq1hy8gIhAKsq6lfDa6K2dbQ0MrwGThAu67lu5y2j0GnVfUB5QvQ1"}]},"_npmUser":{"name":"aureliencabirol","email":"aurelien.cabirol@webnation.tech"},"directories":{},"maintainers":[{"name":"aureliencabirol","email":"aurelien.cabirol@webnation.tech"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/new-component_6.0.0_1712763238595_0.12509169226559802"},"_hasShrinkwrap":false},"6.0.1":{"name":"@aureliencabirol/new-component","version":"6.0.1","description":"CLI for creating new React components","homepage":"https://github.com/AurelienWebnation/new-component","repository":{"type":"git","url":"git+https://github.com/AurelienWebnation/new-component.git"},"bugs":{"url":"https://github.com/AurelienWebnation/new-component/issues"},"main":"src/index.js","keywords":["react","reactjs","cli","component","boilerplate"],"author":{"name":"Joshua Comeau"},"license":"MIT","bin":{"new-component":"src/index.js"},"dependencies":{"chalk":"4","commander":"10","prettier":"2.8.4"},"devDependencies":{"esbuild":"^0.20.2"},"scripts":{"build":"esbuild src/index.js --minify --bundle --platform=node --outfile=dist/index.js"},"_id":"@aureliencabirol/new-component@6.0.1","_integrity":"sha512-Rg6VqybOL1kYstyu84PxY0qvxsf+KHkDMd9z42w+HQ6vAdXpeQRTVE9JiMR9vAOGREnJjG2VfmtLYXpGgxObFg==","_resolved":"/tmp/ab686c7fbb759f21efc5551bbadb2f87/aureliencabirol-new-component-6.0.1.tgz","_from":"file:aureliencabirol-new-component-6.0.1.tgz","_nodeVersion":"18.17.1","_npmVersion":"9.6.7","dist":{"integrity":"sha512-Rg6VqybOL1kYstyu84PxY0qvxsf+KHkDMd9z42w+HQ6vAdXpeQRTVE9JiMR9vAOGREnJjG2VfmtLYXpGgxObFg==","shasum":"22edbc773c817b6ffe7a456b35e476608b7d5561","tarball":"https://registry.npmjs.org/@aureliencabirol/new-component/-/new-component-6.0.1.tgz","fileCount":5,"unpackedSize":5151836,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC6Byufk0pEUAcmrr4CfTD0YX6LWguI/VEWqdjuUhV71gIhAMpisJ38IAq9qk0sVqZvLpRbLE3Ut0s/PJvkGOz++D4d"}]},"_npmUser":{"name":"aureliencabirol","email":"aurelien.cabirol@webnation.tech"},"directories":{},"maintainers":[{"name":"aureliencabirol","email":"aurelien.cabirol@webnation.tech"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/new-component_6.0.1_1712843546423_0.5315653533044455"},"_hasShrinkwrap":false},"6.0.2":{"name":"@aureliencabirol/new-component","version":"6.0.2","description":"CLI for creating new React components","homepage":"https://github.com/AurelienWebnation/new-component","repository":{"type":"git","url":"git+https://github.com/AurelienWebnation/new-component.git"},"bugs":{"url":"https://github.com/AurelienWebnation/new-component/issues"},"main":"src/index.js","keywords":["react","reactjs","cli","component","boilerplate"],"author":{"name":"Joshua Comeau"},"license":"MIT","bin":{"new-component":"src/index.js"},"dependencies":{"chalk":"4","commander":"10","prettier":"2.8.4"},"_id":"@aureliencabirol/new-component@6.0.2","_integrity":"sha512-WzZt/qYMJ2TmNKxrYEh1GsJ51G0sSeUFhpja1oQG8zVvGBpgiFlh6NFavmv84euXiSrO2Y4F3nyFtnhupvCD4A==","_resolved":"/tmp/6738f27551f328a378b70ba7413b0c3d/aureliencabirol-new-component-6.0.2.tgz","_from":"file:aureliencabirol-new-component-6.0.2.tgz","_nodeVersion":"18.17.1","_npmVersion":"9.6.7","dist":{"integrity":"sha512-WzZt/qYMJ2TmNKxrYEh1GsJ51G0sSeUFhpja1oQG8zVvGBpgiFlh6NFavmv84euXiSrO2Y4F3nyFtnhupvCD4A==","shasum":"a85565c42239579b51cf73b5214756776ca9a8b3","tarball":"https://registry.npmjs.org/@aureliencabirol/new-component/-/new-component-6.0.2.tgz","fileCount":13,"unpackedSize":86799,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFhGvLFKNLVPyqdw7IYtMa8GbmPZn+tA90YPvtCi863HAiEA1OowgOAYcvdUFea9kYOTHB/DPx/OI+S3d7CNwvGaxMU="}]},"_npmUser":{"name":"aureliencabirol","email":"aurelien.cabirol@webnation.tech"},"directories":{},"maintainers":[{"name":"aureliencabirol","email":"aurelien.cabirol@webnation.tech"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/new-component_6.0.2_1712844695142_0.1699995027380663"},"_hasShrinkwrap":false}},"time":{"created":"2024-04-10T15:33:58.476Z","6.0.0":"2024-04-10T15:33:58.739Z","modified":"2024-04-11T14:11:35.576Z","6.0.1":"2024-04-11T13:52:26.729Z","6.0.2":"2024-04-11T14:11:35.413Z"},"maintainers":[{"name":"aureliencabirol","email":"aurelien.cabirol@webnation.tech"}],"description":"CLI for creating new React components","homepage":"https://github.com/AurelienWebnation/new-component","keywords":["react","reactjs","cli","component","boilerplate"],"repository":{"type":"git","url":"git+https://github.com/AurelienWebnation/new-component.git"},"author":{"name":"Joshua Comeau"},"bugs":{"url":"https://github.com/AurelienWebnation/new-component/issues"},"license":"MIT","readme":"<p align=\"center\">\n  <img src=\"https://github.com/joshwcomeau/new-component/blob/main/docs/logo@2x.png?raw=true\" width=\"285\" height=\"285\" alt=\"new-component logo\">\n  <br>\n  <a href=\"https://www.npmjs.org/package/new-component\"><img src=\"https://img.shields.io/npm/v/new-component.svg?style=flat\" alt=\"npm\"></a>\n</p>\n\n# new-component\n\n### Simple, customizable utility for adding new React components to your project.\n\n<img src=\"https://github.com/joshwcomeau/new-component/blob/main/docs/divider@2x.png?raw=true\" width=\"888\" height=\"100\" role=\"presentation\">\n\nThis project is a CLI tool that allows you to quickly scaffold new components. All of the necessary boilerplate will be generated automatically.\n\nThis project uses an opinionated file structure discussed in this blog post: [**Delightful React File/Directory Structure**](https://www.joshwcomeau.com/react/file-structure/).\n\n> **NOTE: This project is not actively maintained.** I continue to use it in my own projects, but I don't have the bandwidth to review PRs or triage issues. Feel free to fork this project and tweak it however you wish. ❤️\n\n<br />\n\n## Features\n\n- Simple CLI interface for adding React components.\n- Uses [Prettier](https://github.com/prettier/prettier) to stylistically match the existing project.\n- Offers global config, which can be overridden on a project-by-project basis.\n- Colourful terminal output!\n\n<br />\n\n> **Version 5:** The new version adds support for TypeScript, and removes support for passing a custom file extension;\n\n## Quickstart\n\nInstall via NPM:\n\n```bash\n# Using Yarn:\n$ yarn global add new-component\n\n# or, using NPM\n$ npm i -g new-component\n```\n\n`cd` into your project's directory, and try creating a new component:\n\n```bash\n$ new-component MyNewComponent\n```\n\nYour project will now have a new directory at `src/components/MyNewComponent`. This directory has two files:\n\n```jsx\n// `MyNewComponent/index.js`\nexport * from './MyNewComponent';\n```\n\n```jsx\n// `MyNewComponent/MyNewComponent.js`\nexport function MyNewComponent() {\n  return <div></div>;\n}\n```\n\nThese files will be formatted according to your Prettier configuration.\n\n<br />\n\n## Configuration\n\nConfiguration can be done through 3 different ways:\n\n- Creating a global `.new-component-config.json` in your home directory (`~/.new-component-config.json`).\n- Creating a local `.new-component-config.json` in your project's root directory.\n- Command-line arguments.\n\nThe resulting values are merged, with command-line values overwriting local values, and local values overwriting global ones.\n\n<br />\n\n## API Reference\n\n### Language\n\nControls which language, JavaScript or TypeScript, should be used.\n\n- `js` — creates a `.js` file (default).\n- `ts` — creates a `.tsx` file.\n\nNote that all components created will be functional components. Class components are not supported.\n\n**Usage:**\n\nCommand line: `--lang <value>` or `-l <value>`\n\nJSON config: `{ \"lang\": <value> }`\n<br />\n\n### Directory\n\nControls the desired directory for the created component. Defaults to `src/components`\n\n**Usage:**\n\nCommand line: `--dir <value>` or `-d <value>`\n\nJSON config: `{ \"dir\": <value> }`\n<br />\n\n## Platform Support\n\nThis has only been tested in macOS. I think it'd work fine in linux, but I haven't tested it. Windows is a big question mark.\n<br />\n\n## Development\n\nTo get started with development:\n\n- Fork and clone the Git repo\n- `cd` into the directory and install dependencies (`yarn install` or `npm install`)\n- Set up a symlink by running `npm link`, while in the `new-component` directory. This will ensure that the `new-component` command uses this locally-cloned project, rather than the global NPM installation.\n- Spin up a test React project.\n- In that test project, use the `new-component` command to create components and test that your changes are working.\n","readmeFilename":"README.md"}