Webpack DllPlugin and DllReferencePlugin

The Dll and DllReference plugins allow the code to be split in multiple bundles in a way the bundles can be compiled independently.

It is possible to build “vendor” scripts in a library that does not need to be compiled often (ex: React, jQuery, Bootstrap, Fontawesome…) and reference it in your app bundle that will need those scripts.

The application bundle, the one that is constantly going to be changed, will be in a separate configuration just referencing a already built “vendor” bundle.

For an example in a full project see https://github.com/brunolm/ts-react-redux-startup

Continue reading

Migrating to React Router 4 with Redux

react-router v4 requires you to do more stuff to add a proper route.

You will need to install:

npm i -S history react-router react-router-redux

browserHistory is no longer available, to create a history object you need:

import { createBrowserHistory } from 'history';
// then call createBrowserHistory()

Continue reading

Using editorconfig to keep your files formatted properly

Editor config is an extension available on Visual Studio Code, Atom, Vim and many other editors, you can check a complete list on the official website.

editorconfig-stickers

It defines a set of rules that your editor follows. You can configure so that all your files, or just some matching the extension, will follow some rules as trim whitespace at the end, tabs as 2 spaces and so on.

This way your files will be consistent across your project, and allows people to contribute without making a mess in your codebase.
Continue reading