Coder Social home page Coder Social logo

reactpack's Introduction

reactpack js-standard-style

one command to build your React frontend.

reactpack

  • Unified package, only one npm i needed.
  • Linting with standard.
  • ES6 with Babel presets react, es2015 and stage-0.
  • PostCSS with precss and autoprefixer.
  • Style extraction into css bundle.
  • Automatic index.html creation with html-webpack-plugin.
  • Source maps for styles and scripts.
  • Watch mode (--watch).
  • Development server mode (--dev).
  • Toggle optimizations with uglify and cssnano (-O).

Install

$ npm i reactpack -g

or

$ npm i reactpack --save-dev

Example

import React, { Component } from 'react'
import { render } from 'react-dom'

require('bootstrap/dist/css/bootstrap.css')

class Example extends Component {
  render () {
    return <h1>Hello World!</h1>
  }
}

render(<Example />, document.getElementById('react-app'))
{
  ...
  "scripts": {
    "build": "reactpack src/index.js",
  },
  "dependencies": {
    "bootstrap": "^3.3.6",
    "react": "^15.1.0",
    "react-dom": "^15.1.0",
  },
  "devDependencies": {
    "reactpack": "^0.2.0"
  },
  ...
}

reactpack

CLI

  Usage: reactpack [options] <entry> [path/to/bundle]

  Options:

    -h, --help       output usage information
    -V, --version    output the version number
    -q, --quiet      no output
    -O, --optimize   optimize
    -w, --watch      watch
    -d, --dev        dev
    -p, --port       port for webpack-dev-server
    --clean          clean everything in bundle path before building
    --no-source-map  do not output source map
    --no-postcss     do not use postcss
    --no-html        do not output an index.html
    --no-lint        turn off linting

reactpack's People

Contributors

rjeli avatar maxmcd avatar timolins avatar

Watchers

James Cloos avatar EGOIST avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.