Skip to content

Instantly share code, notes, and snippets.

@jouni-kantola
Created March 18, 2017 19:38
Show Gist options
  • Save jouni-kantola/2a63a054dbb6f60a5c36ce38913df4fc to your computer and use it in GitHub Desktop.
Save jouni-kantola/2a63a054dbb6f60a5c36ce38913df4fc to your computer and use it in GitHub Desktop.
webpack with babel-loader config
{
"dependencies": {
"is-thirteen": "^2.0.0",
"no-op": "^1.0.3"
},
"devDependencies": {
"autoprefixer": "^6.6.1",
"babel-core": "^6.21.0",
"babel-eslint": "^7.1.1",
"babel-loader": "^6.2.10",
"babel-preset-env": "^1.1.4",
"css-loader": "^0.27.3",
"eslint": "^3.13.0",
"eslint-loader": "^1.6.1",
"html-webpack-plugin": "^2.24.1",
"less": "^2.7.1",
"postcss-loader": "^1.2.1",
"script-ext-html-webpack-plugin": "^1.4.0",
"style-loader": "^0.14.1",
"webpack": "^2.2.1",
"webpack-chunk-hash": "^0.4.0",
"webpack-cli": "https://github.com/webpack/webpack-cli.git#37a594d0346f51c5d62779f835e2293602359a5f",
"webpack-dev-server": "^2.4.2",
"webpack-manifest-plugin": "^1.1.0"
},
"scripts": {
"build": "node_modules/.bin/webpack",
"serve": "node_modules/.bin/webpack-dev-server"
}
}
const path = require('path');
const webpack = require('webpack');
const WebpackChunkHash = require('webpack-chunk-hash');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin');
let plugins = [
new webpack.DefinePlugin({
__DEV__: true
}),
new webpack.optimize.CommonsChunkPlugin({
name: ['vendor', 'manifest'],
minChunks: Infinity
}),
new WebpackChunkHash(),
new webpack.optimize.OccurrenceOrderPlugin(true),
new HtmlWebpackPlugin({
title: 'webpack output by build type',
template: './tmpl/index.ejs'
}),
new ScriptExtHtmlWebpackPlugin({
inline: ['manifest'],
defaultAttribute: 'defer'
})
];
module.exports = {
entry: {
'vendor': ['is-thirteen', 'no-op'],
'app': './src/index.js'
},
output: {
path: 'dist',
filename: '[name].[chunkhash].js'
},
module: {
preLoaders: [
{
test: /\.js$/,
loader: 'eslint-loader',
exclude: /(node_modules)/
}
],
loaders: [
{
test: /\.js$/,
exclude: /(node_modules)/,
loader: 'babel-loader',
query: {
presets: ['env']
}
},
{
test: /\.css$/,
loader: 'style-loader!css-loader!postcss-loader'
},
]
},
devtool: 'source-map',
plugins: plugins
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment