Skip to content

Instantly share code, notes, and snippets.

@mokargas
Last active February 16, 2017 01:10
Show Gist options
  • Save mokargas/25f0a8489bbd396f09e3171ee8e7f539 to your computer and use it in GitHub Desktop.
Save mokargas/25f0a8489bbd396f09e3171ee8e7f539 to your computer and use it in GitHub Desktop.
Stub Webpack config. ES6, babel, sass, css modules (working version)
//Dev config ONLY
var path = require('path'); // eslint-disable-line no-var
var webpack = require('webpack'); // eslint-disable-line no-var
var merge = require('webpack-merge'); // eslint-disable-line no-var
var HtmlWebpackPlugin = require('html-webpack-plugin'); // eslint-disable-line no-var
var NpmInstallPlugin = require('npm-install-webpack-plugin'); // eslint-disable-line no-var
var autoprefixer = require('autoprefixer'); // eslint-disable-line no-var
var ExtractTextPlugin = require('extract-text-webpack-plugin'); // eslint-disable-line no-var
const TARGET = process.env.npm_lifecycle_event;
console.log("target event is " + TARGET, 'in', __dirname);
var common = {
cache: false,
debug: true,
watch: true,
entry: './src/index.js',
resolve: {
extensions: ['','.js']
},
output: {
path: './build',
devtoolLineToLine : true,
pathinfo : true,
path : __dirname,
filename : 'bundle.js',
sourceMapFilename : '[file].map'
},
module: {
loaders: [{
test: /\.js[x]?$/,
loaders: ['babel-loader?presets[]=es2015'],
exclude: /(node_modules|bower_components)/
},
{
test: /\.css$/,
loader: 'style!css?modules&localIdentName=[name]---[local]---[hash:base64:5]'
},
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract('style', 'css?modules&importLoaders=1&localIdentName=[name]__[local]!sass'),
exclude: /node_modules|lib/,
},
{
test: /\.woff$/,
loader: "url-loader?limit=10000&mimetype=application/font-woff&name=[path][name].[ext]"
}, {
test: /\.woff2$/,
loader: "url-loader?limit=10000&mimetype=application/font-woff2&name=[path][name].[ext]"
}, {
test: /\.(eot|ttf|svg|gif|png)$/,
loader: "file-loader"
}]
},
plugins: [
new ExtractTextPlugin('app.css', {
allChunks: true
}),
//new webpack.optimize.UglifyJsPlugin({minimize: true}),
new HtmlWebpackPlugin({
title: 'Prototype',
inject: true,
template: './src/index.html'
})
],
postcss: function() {
return [autoprefixer({
browsers: ['last 2 versions']
})];
}
};
if (TARGET === 'dev' || !TARGET) {
module.exports = merge(common, {
devtool: 'source-map',
devServer: {
historyApiFallback: true,
colors:true,
contentBase: './',
historyApiFallback: true,
inline: true,
progress: true
},
output: {
publicPath: 'http://localhost:8080/'
},
plugins: [
new NpmInstallPlugin({
save: true // --save
})
]
});
}
if (TARGET === 'build') {
module.exports = merge(common, {
devtool: 'source-map',
output: {
path: './build'
},
plugins: [
]
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment