Skip to content

Instantly share code, notes, and snippets.

@iiska
Created August 7, 2017 18:34
Show Gist options
  • Save iiska/cb320586fc817c2c09deb1c801d009b4 to your computer and use it in GitHub Desktop.
Save iiska/cb320586fc817c2c09deb1c801d009b4 to your computer and use it in GitHub Desktop.
Webpack configuration for my Hugo sites
const webpack = require("webpack");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const ManifestPlugin = require("webpack-manifest-plugin");
const autoprefixer = require("autoprefixer");
const path = require("path");
module.exports = {
entry: {
main: [
"./assets/javascripts/index.js",
"./assets/stylesheets/all.css.scss"
],
images: "./assets/images/index.js",
vendor: ["./assets/javascripts/highlight.js"]
},
output: {
path: path.join(__dirname, "static"),
filename: "[name].[chunkhash].js"
},
module: {
loaders: [
{
test: /\.s?css$/,
loader: ExtractTextPlugin.extract({
fallback: "style-loader",
use: [
"css-loader",
{
loader: "postcss-loader",
options: {
plugins: loader => [
autoprefixer({
browsers: [
">1%",
"last 4 versions",
"Firefox ESR",
"not ie < 9"
]
})
]
}
},
"sass-loader"
]
})
},
{
exclude: [
/\.html$/,
/\.(js|jsx)$/,
/\.s?css$/,
/\.json$/,
/\.svg$/,
/\.jpg$/,
/\.png$/
],
loader: "url-loader",
query: {
limit: 10000,
name: "media/[name].[hash:8].[ext]"
}
},
// "file" loader image assets
{
include: [/\.png$/, /\.jpg$/, /\.gif$/],
loaders: [
{
loader: "file-loader",
query: {
name: "images/[name].[hash:8].[ext]"
}
},
"image-webpack-loader"
]
},
// "file" loader for svg
{
include: [/\.svg$/],
loader: "file-loader",
query: {
name: "media/[name].[hash:8].[ext]"
}
}
]
},
plugins: [
new ManifestPlugin({
fileName: "../data/manifest.json"
}),
new ExtractTextPlugin("[name].[hash:8].css"),
// JS optimizations
new webpack.NamedChunksPlugin(chunk => {
if (chunk.name) {
return chunk.name;
}
return chunk
.mapModules(m => path.relative(m.context, m.request))
.join("_");
}),
new webpack.NamedModulesPlugin(),
new webpack.optimize.UglifyJsPlugin(),
new webpack.optimize.CommonsChunkPlugin({
name: ["vendor"]
}),
new webpack.optimize.CommonsChunkPlugin({
name: ["runtime"]
})
]
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment