Skip to content

Instantly share code, notes, and snippets.

@magsout
Created July 13, 2015 13:06
Show Gist options
  • Save magsout/9f5ee055554465e285b7 to your computer and use it in GitHub Desktop.
Save magsout/9f5ee055554465e285b7 to your computer and use it in GitHub Desktop.
Webpack + cssnext-loader + stylelint + file-loader
// webpack.config.js
var webpack = require("webpack")
var ExtractTextPlugin = require("extract-text-webpack-plugin")
var path = require("path")
var options = require("minimist")(process.argv.slice(2))
var pathDest = (options.docs) ? "./docs" : "./build"
var cssnext = require("cssnext-loader")
var configSuitcss = require("stylelint-config-suitcss")
var ext = function ext() {
for (var _len = arguments.length, suffix = Array(_len), _key = 0; _key < _len; _key++) {
suffix[_key] = arguments[_key];
}
return new RegExp('\\.(?:' + suffix.join('|') + ')(?:[?#].*)?$');
};
module.exports = {
// The standard entry point and output config
entry: {
index: "./index.js"
},
output: {
filename: "[name].js",
path: path.join(__dirname, pathDest),
publicPath: "",
},
resolve: {
extensions: [
"",
".js",
],
},
cssnext: {
browsers: ['ff >= 20', 'ie >= 9', 'safari >= 5.1', 'opera >= 12', 'chrome >=20'],
compress: true,
messages: {console: true},
import: {
plugins:[
require("stylelint")(configSuitcss),
require("postcss-reporter")
]
}
},
module: {
loaders: [
// Extract css files
{
test: /\.css$/,
loader: ExtractTextPlugin.extract(
"style",
"css!cssnext"
)
},
{ test: ext('svg', 'otf', 'eot', 'ttf', 'woff2?', "png", "gif", ".jp?g"), loader: "file" }
]
},
// Use the plugin to specify the resulting filename (and add needed behavior to the compiler)
plugins: [
new ExtractTextPlugin("[name].css")
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment