# crapp

> Minimalist and flexible tool to set up modern web apps

Latest version **1.2.0** (published 2021-10-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install crapp
pnpm add crapp
yarn add crapp
bun add crapp
```

Provides the command `crapp`.

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.0 |
| Published | 2021-10-13 |
| First published | 2017-09-10 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | >=12.0.0 |
| Dependencies | 29 |
| Unpacked size | 15.6 KB |
| Known vulnerabilities | 0 (+6 in 1 direct dependencies) |
| Install scripts | no |
| Author | Thomas Thiebaud @thomasthiebaud |
| Maintainers | thomasthiebaud |

## Links

- npm: https://www.npmjs.com/package/crapp
- Repository: https://github.com/thomasthiebaud/crapp
- Issues: https://github.com/thomasthiebaud/crapp/issues
- npm.io page: https://npm.io/package/crapp

## Dependencies (29)

- [chalk](https://npm.io/package/chalk.md) ^4.1.2
- [postcss](https://npm.io/package/postcss.md) ^8.3.9
- [prompts](https://npm.io/package/prompts.md) ^2.4.2
- [webpack](https://npm.io/package/webpack.md) ^5.58.0
- [filesize](https://npm.io/package/filesize.md) ^8.0.3
- [fs-extra](https://npm.io/package/fs-extra.md) ^10.0.0
- [commander](https://npm.io/package/commander.md) ^8.2.0
- [css-loader](https://npm.io/package/css-loader.md) ^6.3.0
- [@babel/core](https://npm.io/package/@babel/core.md) ^7.15.8
- [sass-loader](https://npm.io/package/sass-loader.md) ^12.1.0
- [babel-loader](https://npm.io/package/babel-loader.md) ^8.2.2
- [style-loader](https://npm.io/package/style-loader.md) ^3.3.0
- [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.15.4
- [postcss-loader](https://npm.io/package/postcss-loader.md) ^6.1.1
- [@babel/preset-env](https://npm.io/package/@babel/preset-env.md) ^7.15.8
- [postcss-preset-env](https://npm.io/package/postcss-preset-env.md) ^6.7.0
- [resolve-url-loader](https://npm.io/package/resolve-url-loader.md) ^4.0.0
- [webpack-dev-server](https://npm.io/package/webpack-dev-server.md) ^4.3.1
- [@babel/preset-react](https://npm.io/package/@babel/preset-react.md) ^7.14.5
- [html-webpack-plugin](https://npm.io/package/html-webpack-plugin.md) ^5.3.2
- [terser-webpack-plugin](https://npm.io/package/terser-webpack-plugin.md) ^5.2.4
- [mini-css-extract-plugin](https://npm.io/package/mini-css-extract-plugin.md) ^2.4.2
- [@babel/preset-typescript](https://npm.io/package/@babel/preset-typescript.md) ^7.15.0
- [validate-npm-package-name](https://npm.io/package/validate-npm-package-name.md) ^3.0.0
- [css-minimizer-webpack-plugin](https://npm.io/package/css-minimizer-webpack-plugin.md) ^3.1.1
- [fork-ts-checker-webpack-plugin](https://npm.io/package/fork-ts-checker-webpack-plugin.md) ^6.3.4
- [@babel/plugin-transform-runtime](https://npm.io/package/@babel/plugin-transform-runtime.md) ^7.15.8
- [case-sensitive-paths-webpack-plugin](https://npm.io/package/case-sensitive-paths-webpack-plugin.md) ^2.4.0
- [babel-plugin-transform-react-remove-prop-types](https://npm.io/package/babel-plugin-transform-react-remove-prop-types.md) ^0.4.24

## Recent versions

- 1.2.0 (latest) — 2021-10-13
- 1.1.1 — 2021-10-09
- 1.1.0 — 2021-10-09
- 1.0.1 — 2021-10-08
- 1.0.0 — 2021-10-08
- 0.0.1 — 2017-09-10

## README

# 💩 CRAPP (CReate APP)

Minimalist and flexible tool to set up modern web apps. Inspired by [Create React App](https://create-react-app.dev/)

## How to use?

Install the dependency

```
npm install -D crapp
```

Create a `webpack.config.js` file at the root of your project with the following content

```js
const getConfig = require("crapp/config/react");
module.exports = getConfig();
```

Add the default `src/index.js` and `public/index.html` files

```js
// ./src/index.js

import React from "react";
import ReactDOM from "react-dom";

ReactDOM.render(
  <React.StrictMode>
    <h1>Hello World</h1>
  </React.StrictMode>,
  document.getElementById("root")
);
```

```html
<!--./public/index.html-->

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Crapp</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>
```

Run

```
crapp start // for developent
crapp build // for production
```

## Add typescript

Install the missing dependencies

```
npm i -D @types/react @types/react-dom typescript
```

Create a `tsconfig.json` file at the root of your project

```
{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "lib": ["es5", "scripthost", "dom"],
    "moduleResolution": "node",
    "esModuleInterop": true,
    "skipLibCheck": true,
    "skipDefaultLibCheck": true,
    "strict": false,
    "allowJs": true,
    "jsx": "react",
    "outDir": "./dist"
  },
  "exclude": ["node_modules", "dist"]
}
```

Change the extension of typescript files to `.tsx`.

## How to change the configuration?

`crapp/config/react` just exports a normal webpack configuration. You can import it and tweak it at will

```js
const getConfig = require("crapp/config/react");
const config = getConfig(/* You can force NODE_ENV here */);

// Do something with the defaultConfig here

module.exports = config;
```

## How to change the build/start scripts?

`crapp build` and `crapp start` are tiny CLI helpers that use `webpack` and `webpack-dev-server` under the hood.
You can replace them by anything that understand a webpack configuration

---
_Source: https://npm.io/package/crapp · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._