This package has been deprecated

Author message:

This

Route Splitting

Simple npm package to generate multiple bundle files for your different routes (code splitting).

Instead of generating one big bundle file which holds everything, why not split them ? one small bundle file will be loaded when the user first access your web app, and then when the user tries to go to a different route, only the corresponding bundle file will be downloaded. this will make your web app load faster for the first time and leave a great first impression.

Basic Usage

Folder structure

The package is currently working using this type of folder structure for your project

    node_modules/
    src/
        components/
        index.js
        routes.js
        ...
    ...

File name: routes.js

/**
* import your main component (app.js)
* import your index component (indexComponent.js)
* import the package
**/
import App from './components/app.js';
import indexComponent from './components/indexComponent.js';
var routeBundler = require('route-splitting');
 
/**
* define your child routes in an object
* pass the object to the function call with your main and index components
**/
const mychildroutes =  [
 	    {
 		    path:'posts/new',
 		    componentPath:'components/posts_new'
 	    },
 	    {
 		    path:'posts/:id',
 		    componentPath:'components/posts_show'
 	    }
    ];
 
export const componentRoutes = routeBundler(App, PostsIndex, mychildroutes);
/**
* in this example my first child route is posts_new and the path is 'posts/new'
* and my second route is posts_show and the path is 'posts/:id'
**/

File name: index.js

/**
* import the object returned by the package and use it in Router
**/
 
import {componentRoutes} from './routes.js';
 
ReactDOM.render(
<Provider store=store>
    <Router history={hashHistory} routes={componentRoutes} />
</Provider>
, document.querySelector('.container'));