📦 An easy tool compiles and bundles your React app 📦
- Bundle whole application into one JavaScript file
- Make your JSX and ES2015 scripts work in browser
- No need for any extra configuraions
-
Install
repackas a global command with npm,$ sudo npm install -g @jjwong0915/repack
or a project dependency if you wan't to use the API.
$ npm install --save @jjwong0915/repack
-
Create two files
helloWorld.htmlandreactApp.jsx.helloWorld.html:
<!DOCTYPE html> <html> <head> <title>Hello Repack</title> </head> <body> <div id="container"></div> <script src="bundle.js"></script> </body> </html>
reactApp.jsx:
import reactDOM from 'react-dom'; // ES6 Syntax reactDOM.render( <h1>Hello World!</h1>, // JSX Syntax document.getElementById('container') );
-
Compile and bundle
reactApp.jsxintobundle.jswithrepack.$ repack reactApp.jsx bundle.js
-
Open
helloWorld.htmlwith your browser and see the magic works.
Usage: repack [options] <entry> <output>
React developing tool built with Webpack.
Options:
-h, --help output usage information
-V, --version output the version number
-p, --production remove sourcemaps and minimize your scripts
-v, --verbose output all the information webpack has
-w, --watch watches all dependencies and recompile on change
-
Import the
repackAPI byconst repack = require('@jjwong0915/repack');
-
Function
repack(config) => compiler- Object
config {entry, output, production}- String
entry: The entry point for the bundle. (Required) - String
output: The file path to output the bundle. (Required) - Boolean
production: Switch to production mode. (Default:false)
- String
- Object
compiler {run, watch}- Function
run() => result- Promises
result: fullfilled with stats when completed.
- Promises
- Function
watch(handler) => progress
- Function
- Object
- Running the tests with
npm test - Report bugs with github issues
- New ideas about the project are welcome!!!