Skip to content

Instantly share code, notes, and snippets.

@jzevin
Created May 25, 2017 02:54
Show Gist options
  • Save jzevin/53bb96e243c06404b32e4e6c6e4a47a2 to your computer and use it in GitHub Desktop.
Save jzevin/53bb96e243c06404b32e4e6c6e4a47a2 to your computer and use it in GitHub Desktop.
webpack 2 demo pf public path in extract
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextWebpackPlugin = require('extract-text-webpack-plugin');
const isProd = process.env.NODE_ENV === 'production';
const options = {
entry: './src/js/app.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'js/app.bundle.js'
},
module: {
rules: [
{
test: /\.scss$/,
use: ExtractTextWebpackPlugin.extract({
fallbackLoader: 'style-loader',
loader: ['css-loader','sass-loader'],
publicPath: '../' //needed for prod paths to be correct for extracted files and their contained paths
})
},
{
test: /\.pug$/,
loader: 'pug-loader',
options: {pretty: isProd}
},
{
test: /\.(jpe?g|png|gif|svg)$/i,
loader: 'file-loader',
options: {
name: '[name]_[hash:6].[ext]',
outputPath: 'img/',
}
}
]
},
devServer: {
contentBase: path.join(__dirname, 'dist'),
compress: true,
port: 9000,
stats: 'minimal'
},
plugins: [
new HtmlWebpackPlugin({
title: 'Webpack 2 - Starter! Now with Pug',
minify: {
collapseWhitespace: true
},
hash: true,
template: './src/index-template.pug'
}),
new ExtractTextWebpackPlugin({
filename: 'css/main.css',
disable: !isProd
})
]
}
module.exports = options;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment