top of page
Logo der Online Agentur mdwp

DevDependencies

DevDependencies in React JS refers to the packages or modules that are necessary only in the development environment and not required when the application is in production mode. These are tools, libraries, or frameworks that assist in the development process but aren't needed for the app itself to run.

For example, testing libraries, ESLint, Babel, Webpack, etc., are all usually included as devDependencies. They provide certain features in the development process, like linting, transpiling ES6 code to ES5, or bundling the code, but these features aren't needed for the final deployed application.

You can add devDependencies to your React app using npm or yarn package managers.

Using npm:
```bash
npm install --save-dev package-name
```

Using yarn:
```bash
yarn add --dev package-name
```

Here `package-name` is the name of the package you want to add as a devDependency. Once added, this package will be listed in your `package.json` file under `devDependencies`.

A sample `package.json` file:

```json
{
"name": "my-react-app",
"version": "1.0.0",
"description": "A react app",
"main": "index.js",
"dependencies": {
"react": "^16.8.6",
"react-dom": "^16.8.6"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"webpack": "^4.38.0",
"webpack-cli": "^3.3.7"
},
"scripts": {
"start": "webpack --mode development",
"build": "webpack --mode production"
}
}
```
In this example, `babel-core, babel-loader, webpack, webpack-cli` are devDependencies, important for development and build processes, but not for the application to run.

bottom of page