Obtool NPM | npm.io

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

$ 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

@everything-registry/sub-chunk-2367 @zalastax/nolb-obt

0.1.2

7 years ago

0.1.1

7 years ago

0.1.0

7 years ago