Remove gulp, let's go full webpack

gulpfile.babel.js

@@ -1,43 +0,0 @@
-import gulp from 'gulp';
-import babel from 'gulp-babel';
-import del from 'del';
-import webpack from 'webpack-stream';
-import webpackConfig from './webpack.config.babel';
-
-const paths = {
-  allSrcJs: 'src/**/*.js?(x)',
-  jsSrc: 'src/public/js/app.js',
-  jsDistDir: 'build/public/js',
-  imgSrc: 'src/public/img/*',
-  imgDest: 'build/public/img/',
-  htmlSrc: 'src/public/index.html',
-  htmlDest: 'build/public/',
-  gulpFile: 'gulpfile.babel.js',
-  webpackFile: 'webpack.config.babel.js',
-};
-
-gulp.task('images', () =>
-  gulp.src(paths.imgSrc)
-    .pipe(gulp.dest(paths.imgDest))
-);
-
-gulp.task('html', () =>
-  gulp.src(paths.htmlSrc)
-    .pipe(gulp.dest(paths.htmlDest))
-);
-
-gulp.task('js', () =>
-    gulp.src(paths.jsSrc)
-  .pipe(webpack(webpackConfig))
-  .pipe(gulp.dest(paths.jsDistDir))
-);
-
-gulp.task('main', ['images', 'html', 'js'])
-
-gulp.task('watch', () => {
-  gulp.watch(paths.allSrcJs, ['js']);
-  gulp.watch(paths.imgSrc, ['images']);
-  gulp.watch(paths.htmlSrc, ['html']);
-});
-
-gulp.task('default', ['watch', 'main']);

package.json

@@ -1,13 +1,7 @@
 {
     "name": "canape",
     "scripts": {
-        "start": "gulp"
+        "start": "./node_modules/webpack/bin/webpack.js -d --progress --colors --watch"
-    },
-    "babel": {
-        "presets": [
-            "react",
-            "latest"
-        ]
     },
     "dependencies": {
         "babel-polyfill": "^6.16.0",
@@ -31,7 +25,9 @@
     "devDependencies": {
         "axios": "^0.15.2",
         "babel": "^6.5.2",
+        "babel-core": "^6.18.2",
         "babel-loader": "^6.2.7",
+        "babel-preset-es2015": "^6.18.0",
         "babel-preset-latest": "^6.16.0",
         "babel-preset-react": "^6.16.0",
         "css-loader": "^0.26.0",

src/public/js/app.js

@@ -1,4 +1,13 @@
-import 'babel-polyfill'
+// Html page
+import 'file-loader?name=[name].[ext]!../index.html'
+
+// Import default image
+import 'file-loader?name=img/[name].png!../img/noimage.png'
+
+// Styles
+import '../less/app.less'
+
+// React
 import React from 'react'
 import ReactDOM from 'react-dom'
 import { bindActionCreators } from 'redux'
@@ -7,9 +16,6 @@ import { Router, Route, IndexRoute, IndexRedirect, Link, hashHistory } from 'rea
 import { routerActions } from 'react-router-redux'
 import { UserAuthWrapper } from 'redux-auth-wrapper'
 
-// Style
-import '../less/app.less'
-
 // Root reducer
 import rootReducer from './reducers/index'
 

webpack.config.babel.js

@@ -1,35 +0,0 @@
-var webpack = require("webpack");
-
-export default {
-  output: {
-    filename: 'app.js',
-  },
-  devtool: 'source-map',
-  module: {
-    loaders: [
-      {
-        test: /\.less$/,
-        loader: 'style-loader!css-loader!less-loader',
-      },
-      {
-        test: /\.jsx?$/,
-        loader: 'babel-loader',
-        exclude: [/node_modules/],
-      },
-      { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff" },
-      { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader" }
-    ],
-  },
-  plugins: [
-    new webpack.ProvidePlugin({
-      $: "jquery",
-      jQuery: "jquery"
-    }),
-    new webpack.DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('development')
-    })
-  ],
-  resolve: {
-    extensions: ['', '.js', '.jsx'],
-  },
-};

webpack.config.js

@@ -0,0 +1,48 @@
+var webpack = require("webpack");
+var path = require("path");
+
+var BUILD_DIR = path.resolve(__dirname, 'build/public/');
+var SRC_DIR = path.resolve(__dirname, 'src/public/js');
+
+module.exports = {
+  entry: path.join(SRC_DIR, 'app.js'),
+  output: {
+    path: BUILD_DIR,
+    filename: 'js/app.js',
+  },
+  devtool: 'source-map',
+  module: {
+    loaders: [
+      {
+        test: /\.jsx?$/,
+        loader: 'babel-loader',
+        exclude: /node_modules/,
+        query: {
+          compact: false,
+          presets: ["es2015", "react" ]
+        }
+      },
+      {
+        test: /\.less$/,
+        loader: 'style-loader!css-loader!less-loader',
+      },
+      {
+        test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        loader: "url-loader?limit=10000&mimetype=application/font-woff"
+
+      },
+      {
+        test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        loader: "file-loader"
+      }
+    ]
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('development')
+    })
+  ],
+  resolve: {
+    extensions: ['', '.js', '.jsx']
+  },
+};

yarn.lock

@@ -171,7 +171,7 @@ babel-code-frame@^6.11.0, babel-code-frame@^6.16.0:
     esutils "^2.0.2"
     js-tokens "^2.0.0"
 
-babel-core@^6.0.2, babel-core@^6.18.0:
+babel-core, babel-core@^6.0.2, babel-core@^6.18.0:
   version "6.18.2"
   resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.18.2.tgz#d8bb14dd6986fa4f3566a26ceda3964fa0e04e5b"
   dependencies:
@@ -317,7 +317,7 @@ babel-helpers@^6.16.0:
     babel-runtime "^6.0.0"
     babel-template "^6.16.0"
 
-babel-loader@^6.2.7:
+babel-loader:
   version "6.2.7"
   resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-6.2.7.tgz#16fdbf64328030dc5a606827d389c8b92a2a8032"
   dependencies:
@@ -601,7 +601,7 @@ babel-polyfill:
     core-js "^2.4.0"
     regenerator-runtime "^0.9.5"
 
-babel-preset-es2015@^6.16.0:
+babel-preset-es2015, babel-preset-es2015@^6.16.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-preset-es2015/-/babel-preset-es2015-6.18.0.tgz#b8c70df84ec948c43dcf2bf770e988eb7da88312"
   dependencies: