{"_id":"@c4605/preset-create-react-app","_rev":"1-3ef635259b355d5e66f745ebe57ef74e","name":"@c4605/preset-create-react-app","dist-tags":{"latest":"4.0.0-1"},"versions":{"4.0.0-1":{"name":"@c4605/preset-create-react-app","version":"4.0.0-1","description":"Create React App preset for Storybook","license":"MIT","main":"dist","types":"dist","homepage":"https://github.com/storybookjs/presets/tree/master/packages/preset-create-react-app","bugs":{"url":"https://github.com/storybookjs/presets/issues"},"repository":{"type":"git","url":"https://github.com/storybookjs/presets.git","directory":"packages/preset-create-react-app"},"scripts":{"build":"rm -rf dist && tsc","build-watch":"yarn build -w","build-storybook":"exit 0;","prepublishOnly":"yarn build"},"dependencies":{"@pmmmwh/react-refresh-webpack-plugin":"^0.5.1","@types/babel__core":"^7.1.7","babel-plugin-react-docgen":"^4.1.0","pnp-webpack-plugin":"^1.7.0","@storybook/react-docgen-typescript-plugin":"canary","react-scripts":"^4.0.3","semver":"^7.3.5"},"devDependencies":{"@storybook/node-logger":"^6.3.2","@types/semver":"^7.3.6","typescript":"^4.1.3"},"peerDependencies":{"@babel/core":"*","@storybook/node-logger":"*","@storybook/react":">=5.2"},"publishConfig":{"access":"public"},"_id":"@c4605/preset-create-react-app@4.0.0-1","dist":{"shasum":"dd935d0c192ba18d42d8a3fb368cef698ae4538f","integrity":"sha512-+pyHXiuo1+4cOjRQpxvnVKGiP4BsBfac+jX2idCwfSDQMI/Tpdz+U92Kesq/7plmycUboHtuDBs8n0W8Yu2SkA==","tarball":"https://registry.npmjs.org/@c4605/preset-create-react-app/-/preset-create-react-app-4.0.0-1.tgz","fileCount":27,"unpackedSize":42142,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3EJCCRA9TVsSAnZWagAAKeIP/id1SajtiTdZzkVg8zIs\nOPE9FfNPpoY/sFw5RG2OrEl5APO9+ksK1rpkU3s/ejW4aFb9vFfU7qCgbX1b\nHaVDKK1MjYYssELWIUVw6EXZetnmdwuu3sQu1EOwpLn/Wigj6sXr5gP+kqr4\n9hqacVz3ArL3GpQyc5/R+TThTG9TyYXoKWzQrKWM1xghIJCJV5p2mUVnHHlf\nH9pIJZ7hDsXRhmsA+MCS6J2YfClZ6q06zh023PaAaGB0XC8a9PsiFV1dXnxC\nA7xS91BmhVvboQaa/S5DI3pD4Rd9qYcj8B927wholSXp+kO06vkdEBfiCm7U\n8TAdG8JqT3Dd8MZbEQzCcZ0cfv6a8viwtmGwe7rOF/LPvYlGQ6Veicdfy9Wi\nAXOk/+/J3xEcapBplve85M+iEEr9+5AqzCMc29IIWTb1hKW2X7mv8VN2ZwUV\nahl9+QWimuqdtFtw3oQkff9AL1S66iAFtXFAEr4okF5CpcMzusHJnJsmYmpY\nqt9nwIFsrb3zo3B5XUrEmOTqYhgpAjefIR/SkivL5wXQcQT1SeztWlk9wI4u\nh0Hn1miDKi2kL2j9a/N5oVT3Nfrm6hwNFWGSB8yS1i1EshHsJNBTocl2N1nt\nNq9mRUnKgmehHLFZSkOfMElAZnQb6fXZHxrkVWZanOXOINiUIWg22qgOSBSl\nd79r\r\n=edmj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDCK7CyEp15OXAe14MuNvteS2JIoaBgvmqIM2OpCC+8/wIgUTJE64dGeP4h+MpkFvoNSbuym+XUlsDh7L2Rxz+dkLs="}]},"_npmUser":{"name":"bolasblack","email":"bolasblack@gmail.com"},"directories":{},"maintainers":[{"name":"bolasblack","email":"bolasblack@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/preset-create-react-app_4.0.0-1_1641824834626_0.2909870931458509"},"_hasShrinkwrap":false}},"time":{"created":"2022-01-10T14:27:14.582Z","4.0.0-1":"2022-01-10T14:27:14.793Z","modified":"2022-04-04T21:25:24.783Z"},"maintainers":[{"name":"bolasblack","email":"bolasblack@gmail.com"}],"description":"Create React App preset for Storybook","homepage":"https://github.com/storybookjs/presets/tree/master/packages/preset-create-react-app","repository":{"type":"git","url":"https://github.com/storybookjs/presets.git","directory":"packages/preset-create-react-app"},"bugs":{"url":"https://github.com/storybookjs/presets/issues"},"license":"MIT","readme":"# Create React App preset for Storybook\n\nOne-line [Create React App](https://github.com/facebook/create-react-app) configuration for Storybook.\n\nThis preset is designed to use alongside [`@storybook/react`](https://github.com/storybookjs/storybook/tree/master/app/react).\n\n## Basic usage\n\n**Note: you don't need to do this manually** if you used `npx -p @storybook/cli sb init` on a create-react-app, everything should properly setup already ✅.\n\nFirst, install this preset to your project.\n\n```sh\n# Yarn\nyarn add -D @storybook/preset-create-react-app\n\n# npm\nnpm install -D @storybook/preset-create-react-app\n```\n\nOnce installed, add this preset to the appropriate file:\n\n- `./.storybook/main.js` (for Storybook 5.3.0 and newer)\n\n  ```js\n  module.exports = {\n    addons: ['@storybook/preset-create-react-app'],\n  };\n  ```\n\n- `./.storybook/presets.js` (for all Storybook versions)\n\n  ```js\n  module.exports = ['@storybook/preset-create-react-app'];\n  ```\n\n## Advanced usage\n\n### Usage with Docs\n\nWhen working with Storybook Docs, simply add the following config to your `main.js` file.\n\n```js\nmodule.exports = {\n  addons: [\n    '@storybook/preset-create-react-app',\n    {\n      name: '@storybook/addon-docs',\n      options: {\n        configureJSX: true,\n      },\n    },\n  ],\n};\n```\n\n### CRA overrides\n\nThis preset uses CRA's Webpack/Babel configurations, so that Storybook's behavior matches your app's behavior.\n\nHowever, there may be some cases where you'd rather override CRA's default behavior. If that is something you need, you can use the `craOverrides` object.\n\n| Option               | Default          | Behaviour | Type       | Description                                                                                                        |\n| -------------------- | ---------------- | --------- | ---------- | ------------------------------------------------------------------------------------------------------------------ |\n| `fileLoaderExcludes` | `['ejs', 'mdx']` | Extends   | `string[]` | Excludes file types (by extension) from CRA's `file-loader` configuration. The defaults are required by Storybook. |\n\nHere's how you might configure this preset to ignore PDF files so they can be processed by another preset or loader:\n\n```js\nmodule.exports = {\n  addons: [\n    {\n      name: '@storybook/preset-create-react-app',\n      options: {\n        craOverrides: {\n          fileLoaderExcludes: ['pdf'],\n        },\n      },\n    },\n  ],\n};\n```\n\n### Custom `react-scripts` packages\n\nIn most cases, this preset will find your `react-scripts` package, even if it's a fork of the offical `react-scripts`.\n\nIn the event that it doesn't, you can set the package's name with `scriptsPackageName`.\n\n```js\nmodule.exports = {\n  addons: [\n    {\n      name: '@storybook/preset-create-react-app',\n      options: {\n        scriptsPackageName: '@my/react-scripts',\n      },\n    },\n  ],\n};\n```\n\n### Warning for forks of 'react-scripts'\n\nOne of the tasks that this preset does is inject the storybook config directory (the default is `.storybook`)\ninto the `includes` key of the webpack babel-loader config that react-scripts (or your fork) provides. This is\nnice because then any components/code you've defined in your storybook config directory will be run through the\nbabel-loader as well.\n\nThe potential gotcha exists if you have tweaked the Conditions of the webpack babel-loader rule in your fork of\nreact-scripts. This preset will make the `include` condition an array (if not already), and inject the storybook\nconfig directory. If you have changed the conditions to utilize an `exclude`, then BOTH conditions will need to\nbe true (which isn't likely going to work as expected).\n\nThe steps to remedy this would be to follow the steps for customizing the webpack config within the storybook\nside of things. [Details for storybook custom webpack config](https://storybook.js.org/docs/configurations/custom-webpack-config/)\nYou'll have access to all of the rules in `config.module.rules`. You'll need to find the offending rule,\nand customize it how you need it to be to be compatible with your fork.\n\nSee [Webpack Rule Conditions](https://webpack.js.org/configuration/module/#rule-conditions) for more details\nconcerning the conditions.\n\n## Resources\n\n- [Walkthrough to set up Storybook Docs with CRA & typescript](https://gist.github.com/shilman/bc9cbedb2a7efb5ec6710337cbd20c0c)\n- [Example projects (used for testing this preset)](https://github.com/storybookjs/presets/tree/master/examples)\n","readmeFilename":"README.md"}