obtool
Front-end build tool, based on webpack, faced to react, with hot reload
Last updated 2 years ago by ou.yancey .
MIT · Original npm · Tarball · package.json
$ cnpm install obtool 
SYNC missed versions from official npm registry.

obtool

Front-end build tool, based on webpack, faced to react, with hot reload.

Usage

Step 1

$ npm install --save-dev obtool
$ npm install react react-dom

or

$ yarn add --dev obtool
$ yarn add react react-dom

Step 2

Edit your package.json, add scripts like this:

{
    "scripts": {
        "start": "obtool start",
        "build": "obtool build"
    },
}

Step 3

Create file public/index.html, src/index.js, src/App.js.

$ mkdir public src
$ touch public/index.html src/index.js src/App.js

Step 4

Copy this in your public/index.html.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div id="root"></div>
</body>
</html>

Copy this in your src/index.js.

import ReactDOM from 'react-dom'
import { AppContainer } from 'react-hot-loader'

import App from './App'

const render = Component => ReactDOM.render(
    <AppContainer>
        <Component />
    </AppContainer>,
    document.getElementById('root')
)

render(App)

if (module.hot) module.hot.accept('./App', () => render(App))

Copy this in your src/App.js.

import React from 'react'

class App extends React.Component {
    render() {
        return <div>Hello, World</div>
    }
}

export default App

Should I add init script?

Step 5

Finally, let's run npm start or yarn start.

Inspired By

Current Tags

  • 0.1.2                                ...           latest (2 years ago)

3 Versions

  • 0.1.2                                ...           2 years ago
  • 0.1.1                                ...           2 years ago
  • 0.1.0                                ...           2 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 3
Last Day 0
Last Week 2
Last Month 1
Dev Dependencies (1)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |