Sign in
Log inSign up

Cant make webpack work with ES6 / Babel

Javed's photo
Javed
·May 8, 2017

Here is my webpack config:

import webpack from 'webpack';
import path from 'path';
import HtmlWebpackPlugin from 'html-webpack-plugin';
export default {
    entry: './app/index.js',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'index_bundle.js'
    },
    module: {
        rules: [
            {
                test: /.js$/,
                use: [
                    {
                        loader:'babel-loader',
                        options: { presets: ['es2015'] }
                    }
                ],
                exclude: /node_modules/
            },
            {
                test: /.css$/,
                use: ['style-loader', 'css-loader']
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({  template: 'app/index.html'})
    ]
}

and here is package.json:

{
    "name": "gitbattle",
    "version": "0.0.1",
    "description": "React App Github Battle",
    "main": "app.js",
    "scripts": {
        "create" :"webpack",
        "test": "echo \"Error: no test specified\" && exit 1"
    },
    "repository": {
        "type": "git",
        "url": "github.com/JayBee007/github_battle.git"
    },
    "keywords": [
        "react",
        "github",
        "battle",
        "webpack",
        "babel"
    ],
    "author": "Javed",
    "license": "MIT",
    "bugs": {  "url": "github.com/JayBee007/github_battle/issues" },
    "homepage": "github.com/JayBee007/github_battle#readme",
    "dependencies": {
        "react": "^15.5.4",
        "react-dom": "^15.5.4"
    },
    "devDependencies": {
        "babel-core": "^6.24.1",
        "babel-loader": "^7.0.0",
        "babel-preset-es2015": "^6.24.1",
        "babel-preset-react": "^6.24.1",
        "css-loader": "^0.28.1",
        "html-webpack-plugin": "^2.28.0",
        "style-loader": "^0.17.0",
        "webpack": "^2.5.1",
        "webpack-dev-server": "^2.4.5"
    }
}

Whenever I run npm run create it is unable to find import token. Everything works when I use ES5!

2