@constgen/neutrino-react-loader

Neutrino middleware for React files

This middleware already includes @constgen/neutrino-babel-loader

Features

This middleware enables many features by default with zero configuration

Typescript support
Decorators
Class properties
Babel transpilation according to browserlist
EcmaScript polyfills
Automatic React runtime inject to every JSX file
Resolve URLs in JSX like in HTML for these elements: img[src], link[href], Image[src], video[src], video[poster], Video[src], source[src], audio[src], Audio[src]
Remove prop types in production

Requirements

Node.js v10+
Neutrino v9
Webpack v4

Installation

@constgen/neutrino-react-loader can be installed from NPM. You should install it to "dependencies" (--save) or "devDependncies" (--save-dev) depending on your goal.

npm install --save @constgen/neutrino-react-loader

Usage

In preset

Require this package and plug it into Neutrino. The following shows how you can pass an options object to the middleware, showing the defaults:

let reactLoader = require('@constgen/neutrino-react-loader')

neutrino.use(reactLoader({
   babel    : {}, // custom Babel options
   polyfills: false, // enable EcmaScript polyfills
   browsers : ['defaults'], // replace browserlist config
   node     : undefined, // node version in case of server rendering
   include  : [], // include strategy is always used and you can only extend what is included besides `neutrino.options.source` and `neutrino.options.tests`
   exclude  : [] // exclude something from processing that is included
}))

You may enable usage of .browserslistrc file in your project by setting browsers option to any falsy value

neutrino.use(reactLoader({
   browsers: undefined // inherit config from `.browserslistrc` or disable if absent
}))

In neutrinorc

The middleware also may be used together with another presets in Neutrino rc-file, e.g.:

.neutrinorc.js

let reactLoader = require('@constgen/neutrino-react-loader')

module.exports = {
   use: [
      reactLoader()
   ]
}