react-hot-loader 3.0 vs 1.3 简单对比

好久没更博,好久没更博,好久没更博,好久...

react,一般人都会选择webpack搭配使用,再用上react-hot-loader热替换。不过现在react-hot-loader已经更新到
3.0版本,而其Get Started还是1.3版本的语法。这里简单对比下3.0语法。

webpack.dev.config.js

// v1.3
loaders: [
    { 
        test: /\.jsx?$/,
        loaders: ['react-hot', 'jsx?harmony'],
        include: path.join(__dirname, 'src') 
    }
]

// v3.0
loaders: [
    { 
        test: /\.jsx?$/,
        loaders: ['babel'],
        include: path.join(__dirname, 'src') 
    }
]

.babelrc

// v1.3
{
    "presets": ["es2015", "stage-0", "react"]
}

//v3.0
{
    "presets": [ "es2015", "stage-0", "react"],
    "plugins": ["react-hot-loader/babel"]
}

entry file

// v3.0
import 'react-hot-loader/patch';
import React from 'react';
import { render } from 'react-dom';
import { AppContainer } from 'react-hot-loader';
import RootContainer from './containers/rootContainer.js';

render((
  
    
  
), document.getElementById('react-root'));

if (module.hot) {
  module.hot.accept('./containers/rootContainer.js', () => {
    const NextRootContainer = require('./containers/rootContainer.js').default;

    render((
      
        
      
    ), document.getElementById('react-root'));
  })
}

恩,完了。

如果有疑问,可以查看这个例子。

你可能感兴趣的:(react-hot-loader 3.0 vs 1.3 简单对比)