Set up backbone.js environment with webpack - backbone.js

Question

I've started learning Backbone.js and I'm a little confused with setting up the project. How shoul I set up the Backbone.js environment with Webpack and npm? First, I did
$ npm init
$ npm i webpack --save-dev
$ npm i webpack-dev-server --save-dev
$ npm i backbone --save-dev
$ npm i jquery --save-dev
$ npm i babel-core
$ npm i babel-loader
$ npm i babel-preset-es2015
I had the following in my webpack.config.js
var config = {
entry: './main.js',
output: {
path:'./',
filename: 'index.js',
},
devServer: {
inline: true,
port: 8080
},
module: {
loaders: [
{
exclude: /node_modules/,
loader: 'babel',
query: {
presets: ['es2015']
}
}
]
}
}
module.exports = config;
and in my main.js I had
import Backbone from 'backbone';
import $ from 'jquery';
but nothing worked. How should I make an initial setup for Backbone with ES6? Also, does Backbone support ES6, or it is rather outdated and deprecated for modern time?

Answer 1

I'd suggest you start here: https://github.com/jerrysu/backbone-webpack-example
There's nothing preventing you using Backbone with ES6, though you should read this: http://benmccormick.org/2015/04/07/es6-classes-and-backbone-js/
The first problem I see with your webpack configuration is that your loader is missing a test expression (https://webpack.js.org/configuration/)