# react-scripts-webextension

> Configuration and scripts for Create React WebExtension.

Latest version **0.8.5** (published 2017-11-20) · BSD-3-Clause license · 0 weekly downloads

## Install

```sh
npm install react-scripts-webextension
pnpm add react-scripts-webextension
yarn add react-scripts-webextension
bun add react-scripts-webextension
```

Provides the command `react-scripts-web-ext`.

## Health

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

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.8.5 |
| Published | 2017-11-20 |
| First published | 2017-10-09 |
| Weekly downloads | 0 |
| License | BSD-3-Clause |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | >=6 |
| Dependencies | 43 |
| Known vulnerabilities | 0 (+3 in 2 direct dependencies) |
| Install scripts | no |
| GitHub stars | 7 |
| Maintainers | constfun |

## Links

- npm: https://www.npmjs.com/package/react-scripts-webextension
- Repository: https://github.com/constfun/create-react-WebExtension
- Issues: https://github.com/constfun/create-react-WebExtension/issues
- npm.io page: https://npm.io/package/react-scripts-webextension

## Dependencies (43)

- [find](https://npm.io/package/find.md) 0.2.7
- [jest](https://npm.io/package/jest.md) 20.0.4
- [chalk](https://npm.io/package/chalk.md) 1.1.3
- [dotenv](https://npm.io/package/dotenv.md) 4.0.0
- [eslint](https://npm.io/package/eslint.md) 3.19.0
- [tslint](https://npm.io/package/tslint.md) 5.2.0
- [express](https://npm.io/package/express.md) 4.15.3
- [promise](https://npm.io/package/promise.md) 7.1.1
- [ts-jest](https://npm.io/package/ts-jest.md) 20.0.7
- [webpack](https://npm.io/package/webpack.md) 3.4.1
- [chokidar](https://npm.io/package/chokidar.md) 1.7.0
- [fs-extra](https://npm.io/package/fs-extra.md) 3.0.1
- [ts-loader](https://npm.io/package/ts-loader.md) 2.3.2
- [babel-core](https://npm.io/package/babel-core.md) 6.25.0
- [babel-jest](https://npm.io/package/babel-jest.md) 20.0.3
- [css-loader](https://npm.io/package/css-loader.md) 0.28.4
- [typescript](https://npm.io/package/typescript.md) 2.4.2
- [url-loader](https://npm.io/package/url-loader.md) 0.5.9
- [file-loader](https://npm.io/package/file-loader.md) 0.11.2
- [autoprefixer](https://npm.io/package/autoprefixer.md) 7.1.1
- [babel-eslint](https://npm.io/package/babel-eslint.md) 7.2.3
- [babel-loader](https://npm.io/package/babel-loader.md) 7.0.0
- [style-loader](https://npm.io/package/style-loader.md) 0.18.2
- [tslint-react](https://npm.io/package/tslint-react.md) 3.0.0
- [whatwg-fetch](https://npm.io/package/whatwg-fetch.md) 2.0.3
- [babel-runtime](https://npm.io/package/babel-runtime.md) 6.23.0
- [eslint-loader](https://npm.io/package/eslint-loader.md) 1.7.1
- [object-assign](https://npm.io/package/object-assign.md) 4.1.1
- [tslint-loader](https://npm.io/package/tslint-loader.md) 3.5.3
- [postcss-loader](https://npm.io/package/postcss-loader.md) 2.0.6
- [react-dev-utils](https://npm.io/package/react-dev-utils.md) ^3.0.2
- [tree-from-paths](https://npm.io/package/tree-from-paths.md) ^1.0.0
- [eslint-plugin-react](https://npm.io/package/eslint-plugin-react.md) 7.1.0
- [html-webpack-plugin](https://npm.io/package/html-webpack-plugin.md) 2.29.0
- [eslint-plugin-import](https://npm.io/package/eslint-plugin-import.md) 2.2.0
- [babel-preset-react-app](https://npm.io/package/babel-preset-react-app.md) ^3.0.1
- [eslint-plugin-flowtype](https://npm.io/package/eslint-plugin-flowtype.md) 2.34.0
- [eslint-plugin-jsx-a11y](https://npm.io/package/eslint-plugin-jsx-a11y.md) 5.0.3
- [postcss-flexbugs-fixes](https://npm.io/package/postcss-flexbugs-fixes.md) 3.0.0
- [webpack-hot-middleware](https://npm.io/package/webpack-hot-middleware.md) ^2.18.2
- [eslint-config-react-app](https://npm.io/package/eslint-config-react-app.md) ^1.0.5
- [webpack-manifest-plugin](https://npm.io/package/webpack-manifest-plugin.md) 1.1.0
- [case-sensitive-paths-webpack-plugin](https://npm.io/package/case-sensitive-paths-webpack-plugin.md) 2.1.1

## Recent versions

- 0.8.5 (latest) — 2017-11-20
- 0.8.4 — 2017-11-20
- 0.8.3 — 2017-11-20
- 0.8.2 — 2017-11-20
- 0.8.0 — 2017-10-09

## README

# react-scripts-webextension

This package includes scripts and configuration used by [Create React WebExtension](https://github.com/constfun/create-react-WebExtension).<br>
Please refer to its documentation:

* [Getting Started](https://github.com/constfun/create-react-WebExtension/blob/master/README.md#getting-started) – How to create a new extension.
* [User Guide](https://github.com/constfun/create-react-WebExtension/blob/master/packages/react-scripts/template/README.md) – How to develop extensions bootstrapped with Create React WebExtension.

## Differences to react-scripts (upstream)

### TypeScript support

### Multiple create-react-app "bundles"

WebExtensions are comprised of background scripts, content scripts, option pages, and popup pages. Each of these is a separate set of HTML, CSS, and JavaScript.

However, `create-react-app` produces a single set of `index.html`, `main.js`, and `main.css` as its build output. This is a simple and sensible default considering the goals of the upstream project.

As noted above, the need for multiple sets of HTML, CSS, and JS files is unavoidable even for the simplest of extensions. Create React WebExtensions addresses this need by introducing a simple concept of packs on top of `create-react-app`.

**Any subdirectory containing an empty file named `_bundle` will produce its own set of HTML, CSS, and JavaScript files.**

This feature is opt in. Simply create a new project and use the same workflow as with any Create React app, the directory structure should make sense.

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