Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const javascript = {
test: /\.(js)$/,
use: [{
loader: 'babel-loader',
options: { presets: ['es2015'] }
const styles = {
test: /\.(scss)$/,
use: ExtractTextPlugin.extract(['style-loader', 'css-loader?sourceMap', 'sass-loader?sourceMap'])
const uglify = new webpack.optimize.UglifyJsPlugin({
compress: { warnings: false }
const config = {
entry: {
App: './public/javascripts/delicious-app.js'
devtool: 'source-map',
output: {
path: path.resolve(__dirname, 'public', 'javascripts', 'dist'),
filename: '[name].bundle.js'
module: {
rules: [javascript, styles]
plugins: [
new ExtractTextPlugin('please-just-make-this-a-file.css'),
module.exports = config;
Copy link

thasmo commented Feb 7, 2017

Try use: ExtractTextPlugin.extract(['css-loader?sourceMap', 'sass-loader?sourceMap']) on line 15.

Copy link

wesbos commented Feb 7, 2017

Copy link

wesbos commented Feb 7, 2017

Yep that was it - no need for style-loader

Copy link

bedakb commented Feb 8, 2017

@wesbos you can use style-loader as fallback loader, if you need.I worked on one webpack setup few days ago and this is how I did it:

   test: /\.scss$/,
   use: ExtractTextPlugin.extract({
        fallbackLoader: 'style-loader',
        loader: 'css-loader!sass-loader',
        publicPath: '/public'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment