Skip to content

Commit 9b77acc

Browse files
authored
docs: Instructions added for CRA env (thanks to @sercan5534)
2 parents 9fd4a2a + d939485 commit 9b77acc

File tree

1 file changed

+41
-0
lines changed

1 file changed

+41
-0
lines changed

README.md

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,45 @@ To use api mocker on your [Webpack][] projects, simply add a setup options to yo
146146
},
147147
...
148148
```
149+
### Using with CRA
149150

151+
To use api mocker on your [cra][] projects, please install [customize-cra] and [react-app-rewired] using npm to modify webpack config file:
152+
```
153+
npm install customize-cra react-app-rewired --save-dev
154+
```
155+
Then, create a file named config-overrides.js, override webpack config using below codes:
156+
157+
```js
158+
const apiMocker = require("connect-api-mocker"),
159+
{ overrideDevServer } = require("customize-cra");
160+
161+
const devServerConfig = () => config => {
162+
return {
163+
...config,
164+
before: (app,server)=> {
165+
//call cra before function to not break code
166+
config.before(app, server);
167+
//Then add our mocker url and folder
168+
app.use(apiMocker('/api', 'mocks/api'));
169+
}
170+
}
171+
}
172+
173+
module.exports = {
174+
devServer: overrideDevServer(
175+
devServerConfig()
176+
)
177+
};
178+
```
179+
Finally, change our run method to from "react-scripts start" to "react-app-rewired start" in package.json file:
180+
```js
181+
...
182+
"scripts": {
183+
"start": "react-app-rewired start",
184+
...
185+
}
186+
...
187+
```
150188
### Using with other languages other than JavaScript
151189

152190
If you have a Python/Ruby/.NET etc. project and want to use that mocking functionality, you can use [cli-api-mocker](https://github.com/muratcorlu/cli-api-mocker) as a wrapper of connect-api-mocker for command line. With the help of cli-api-mocker, if you run `mockit` command, you will have a seperate web server that will handle your mocks as a REST API. Please look for [cli-api-mocker readme](https://github.com/muratcorlu/cli-api-mocker) for details.
@@ -487,3 +525,6 @@ apiMocker('/api', {
487525
[lite-server]: https://github.com/johnpapa/lite-server
488526
[webpack]: https://github.com/webpack/webpack
489527
[webpack-dev-server]: https://github.com/webpack/webpack-dev-server
528+
[cra]: https://github.com/facebook/create-react-app
529+
[customize-cra]: https://github.com/arackaf/customize-cra
530+
[react-app-rewired]: https://github.com/timarney/react-app-rewired

0 commit comments

Comments
 (0)