webpack-focus 1.0.2

What's new ?

• Fixing 'something is already running on that port' message
• Adding .ts and .tsx by default in typescript config
• Fixing and improving README

webpack-focus 1.0.1

Correcting typescript config (unnecessary sourceMap)

Webpack focus 1.0.0

Breaking changes :

• Due to use of babel-preset-focus, NODE_ENV should be at development, production or test
• Due to use of babel-preset-focus, if you are using lodash 3.10.1, you may need to set LEGACY_LODASH to true
• If your project in not in ES6 (import and export only), you can go in legacy mode by setting LEGACY_EXPORTS to true
• If you are using the focus-devtools in your project, make sure the render is conditionnal in your layout (__DEV__ && <DevTools/>)

Features :

• Adding error-overlay in dev server
• Now hot reload can be used (project must be in ES6, see below)
• If the env variable ANALYZE is set, you will be able to see what's in your build file (useful, to check for unused dependency, etc or understand the js file size)
• CSS hot reload is now functioning
• You can disable babel-polyfill by setting USE_POLYFILL to false (polyfill is added automatically to your application)
• A configuration for Typescript has been done
• Output files are now sorted between fonts, img and chunks folder
• if DEV is not set, null-loader is used to remove focus-devtools
• Updating dependencies
• Adding polyfill for fetch (browser only)
• USE_CACHE option to accelerate build (default to true)
• PARALLEL_BUILD option to further accelerate build (default to false)

HOW TO - Hot reload:

The only thing to do to enable the hot reload is

• to set HOT_RELOAD env variable to true
• to modify your application like in the link (Step 3, 3c), without the need for import 'react-hot-loader/patch';

http://gaearon.github.io/react-hot-loader/getstarted/#step-3-of-3-adding-react-hot-loader-to-preserve-component-state

import React from 'react';
import ReactDom from 'react-dom';
import { AppContainer } from 'react-hot-loader';

import RootContainer from './containers/rootContainer';

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

render(RootContainer);

if (module.hot) {
  module.hot.accept('./containers/rootContainer', () => { render(RootContainer) });
}

Webpack focus 1.0.0-beta6

Since beta5 :

• Updating dependencies
• Adding polyfill for fetch (browser only)
• USE_CACHE option to accelerate build (default to true)
• PARALLEL_BUILD option to further accelerate build (default to false)

Webpack focus 1.0.0-beta5

Since beta 4:

• Fix chunk naming
• Restore hot reload using new env variable DEV_SERVER_SUBDOMAIN

Webpack focus 1.0.0-beta4

Since beta3:

• [BUGFIX] fix sourcemaps options (devtool in webpack)
• Enhance cache-loader to take in account env variable that could change babel output (LEGACY_EXPORT, LEGACY_LODASH, HOT_RELOAD, BROWSERS)

Webpack focus 1.0.0-beta3

Since beta2 :

• [BUGFIX] fix errorOverlayMiddleware import

Webpack focus 1.0.0-beta2

Since beta1:

• [BUGFIX] focus-core should go through babel
• if DEV is not set, null-loader is used to remove focus-devtools

Webpack focus 1.0.0-beta1

Breaking changes :

• Due to use of babel-preset-focus, NODE_ENV should be at development, production or test
• Due to use of babel-preset-focus, if you are using lodash 3.10.1, you may need to set LEGACY_LODASH to true
• If your project in not in ES6 (import and export only), you can go in legacy mode by setting LEGACY_EXPORTS to true
• If you are using the focus-devtools in your project, make sure the render is conditionnal in your layout (__DEV__ && <DevTools/>)

Features :

• Adding error-overlay in dev server
• Now hot reload can be used (project must be in ES6, see below)
• If the env variable ANALYZE is set, you will be able to see what's in your build file (useful, to check for unused dependency, etc or understand the js file size)
• CSS hot reload is now functioning
• You can disable babel-polyfill by setting USE_POLYFILL to false (polyfill is added automatically to your application)
• A configuration for Typescript has been done
• Output files are now sorted between fonts, img and chunks folder

HOW TO - Hot reload:

The only thing to do to enable the hot reload is

• to setHOT_RELOAD env variable to true
• to modify your application like in the link (Step 3, 3c), without the need for import 'react-hot-loader/patch';

http://gaearon.github.io/react-hot-loader/getstarted/#step-3-of-3-adding-react-hot-loader-to-preserve-component-state

import React from 'react';
import ReactDom from 'react-dom';
import { AppContainer } from 'react-hot-loader';

import RootContainer from './containers/rootContainer';

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

render(RootContainer);

if (module.hot) {
  module.hot.accept('./containers/rootContainer', () => { render(RootContainer) });
}

Webpack focus 0.13.0

Please read the README to know how to use the lib.

Thanks

@Hartorn and @JohnnP for your help and thank you everyone for your bugs' reports and issues in which we have discussed. It helped us to improve webpack-focus