FormidableLabs/builder-react-component

Name: builder-react-component

Owner: Formidable

Description: A React component archetype for builder.

Created: 2015-10-19 22:00:45.0

Updated: 2018-01-11 02:57:30.0

Pushed: 2017-09-30 17:36:14.0

Homepage:

Size: 145

Language: JavaScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

Builder Archetype: React Component

A React component archetype for builder.

Installation

To use the production and development workflows, install both this package and the development module:

m install --save builder-react-component
m install --save-dev builder-react-component-dev

Generator

To bootstrap a new project from scratch with template files from this archetype, you can use builder-init:

m install -g builder-init
ilder-init builder-react-component

This will download this archetype, prompt you for several template data values and inflate the archetype templates to real files at a chosen directory.

Project Structure

See the development guide for workflows associated with this archetype.

The archetype assumes a file structure like the following:

/
p.js
dex.html

mponents/
*.js
dex.js

ient/
spec/
  components/
    *.js
  *.js
main.js
test.html
lderrc
age.json

This matches the builder-init templates found in the source of this archetype.

File / Component Name

The name field in package.json (the published npm package name) is assumed to be:

1. The desired file name of the distribution files and dash-cased.
2. The desired default exported class name when converted to PascalCase.

So, if a package.json has:

ame": "my-cool-component"

The distribution files to output are:

/my-cool-component.js
/my-cool-component.js.map
/my-cool-component.min.js
/my-cool-component.min.js.map

and the exported class name is MyCoolComponent.

Usage Notes

This archetype does not currently specify its own .babelrc. Your project should specify its own in the root directory if you want non-default Babel settings (like using stage 0, for instance). See the recommended settings.

Tasks

ilder help builder-react-component

e:

ilder <action> <task(s)>

ons:

n, concurrent, envs, help

s: General

builderrc: Path to builder config file (default: `.builderrc`)

help: Display help and exit

version: Display version and exit

quiet: Silence logging

log-level: Level to log at (`info`, `warn`, `error`, `none`)

env: JSON string of environment variables to add to process

env-path: JSON file path of environment variables to add to process

s:

m:postinstall
[builder-react-component] builder run build

m:postpublish
[builder-react-component] publishr postpublish -V

m:postversion
[builder-react-component] publishr postversion -V

m:preversion
[builder-react-component] builder run check

m:test
[builder-react-component] builder run test-frontend

m:version
[builder-react-component] builder run clean && builder run build && git add -A dist

ild
[builder-react-component] builder run build-libs && builder run build-dist

ild-babel
[builder-react-component] babel src --copy-files

ild-dist
[builder-react-component] builder run clean-dist && builder run build-dist-min && builder run build-dist-dev

ild-dist-dev
[builder-react-component] webpack --bail --config node_modules/builder-react-component/config/webpack/webpack.config.dev.js --colors

ild-dist-min
[builder-react-component] webpack --bail --config node_modules/builder-react-component/config/webpack/webpack.config.js --colors

ild-es
[builder-react-component] builder run --env '{"BABEL_ENV":"es"}' build-babel -- -d es

ild-lib
[builder-react-component] builder run --env '{"BABEL_ENV":"commonjs"}' build-babel -- -d lib

ild-libs
[builder-react-component] builder concurrent --queue=1 build-lib build-es

eck
[builder-react-component] builder run lint && builder run test

eck-ci
[builder-react-component] builder run lint && builder run test-ci

eck-cov
[builder-react-component] builder run lint && builder run test-cov

eck-dev
[builder-react-component] builder run lint && builder run test-dev

ean
[builder-react-component] builder run clean-libs && builder run clean-dist

ean-dist
[builder-react-component] rimraf dist

ean-libs
[builder-react-component] rimraf es lib

v
[builder-react-component] builder concurrent server-dev server-test

t
[builder-react-component] builder concurrent server-hot server-test

nt
[builder-react-component] builder concurrent lint-server lint-client lint-client-test

nt-client
[builder-react-component] eslint --color -c node_modules/builder-react-component/config/eslint/.eslintrc-client src demo/*.js

nt-client-test
[builder-react-component] eslint --color -c node_modules/builder-react-component/config/eslint/.eslintrc-client-test src test/client

nt-server
[builder-react-component] eslint --color -c node_modules/builder-react-component/config/eslint/.eslintrc-server *.js

en-demo
[builder-react-component] opener http://127.0.0.1:3000

en-dev
[builder-react-component] builder concurrent dev open-demo

en-hot
[builder-react-component] builder concurrent hot open-demo

rver-dev
[builder-react-component] webpack-dev-server --port 3000 --config node_modules/builder-react-component/config/webpack/demo/webpack.config.dev.js --colors --content-base demo

rver-hot
[builder-react-component] webpack-dev-server --port 3000 --config node_modules/builder-react-component/config/webpack/demo/webpack.config.hot.js --colors --hot --content-base demo

rver-test
[builder-react-component] webpack-dev-server --port 3001 --config node_modules/builder-react-component/config/webpack/webpack.config.test.js --colors

st
[builder-react-component] builder run npm:test

st-ci
[builder-react-component] builder run test-frontend-ci

st-cov
[builder-react-component] builder run test-frontend-cov

st-dev
[builder-react-component] builder run test-frontend-dev

st-frontend
[builder-react-component] karma start node_modules/builder-react-component/config/karma/karma.conf.js

st-frontend-ci
[builder-react-component] karma start --browsers PhantomJS,Firefox node_modules/builder-react-component/config/karma/karma.conf.coverage.js

st-frontend-cov
[builder-react-component] karma start node_modules/builder-react-component/config/karma/karma.conf.coverage.js

st-frontend-dev
[builder-react-component] karma start node_modules/builder-react-component/config/karma/karma.conf.dev.js

rsion-dry-run
[builder-react-component] publishr dry-run -V