Skip to content

Instantly share code, notes, and snippets.

@Falconerd
Created October 29, 2016 06:14
Show Gist options
  • Save Falconerd/9d3aa86d47a8021f09a07192d4828692 to your computer and use it in GitHub Desktop.
Save Falconerd/9d3aa86d47a8021f09a07192d4828692 to your computer and use it in GitHub Desktop.
webpack 2, react, redux
$ npm i -S react redux react-redux react-dom webpack@2* webpack-dev-server@2*
$ npm i -D babel-core babel-loader babel-preset-es2015 babel-preset-react
// webpack.config.js
module.exports = {
context: __dirname + '/src',
entry: {
app: './index.js'
},
output: {
path: __dirname + '/dist',
filename: '[name].bundle.js',
publicPath: '/assets'
},
devServer: {
contentBase: __dirname + '/src'
},
module: {
rules: [
{
test: /\.js$/,
use: [{
loader: 'babel-loader',
options: { presets: ['es2015', 'react']}
}]
}
]
}
};
// src/index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Crucible</title>
</head>
<body>
<div id="root"></div>
<script src="/assets/app.bundle.js"></script>
</body>
</html>
// src/app.js
import React, { Component } from 'react';
export default class App extends Component {
render() {
return (
<div>Sup?</div>
);
}
}
// src/index.js
import React from 'react';
import { render } from 'react-dom';
import App from './app.js';
render(<App />, document.getElementById('root'));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment