Skip to content

Instantly share code, notes, and snippets.

@smmoosavi
Last active April 29, 2016 12:16
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save smmoosavi/b9e2f647d995be3a2da8ee1751c134e3 to your computer and use it in GitHub Desktop.
Save smmoosavi/b9e2f647d995be3a2da8ee1751c134e3 to your computer and use it in GitHub Desktop.
npm run build

commented webpack.optimize.UglifyJsPlugin

build/static/app/css/styles.css

._1gwPWr77dmf4i5iRBt9FXY {
  border-color: #1abc9c !important; }

.DrIhMabgaalOg4mkpO6Q6 {
  border-color: #16a085 !important; }

._3_TLmw6hMAhtdZvapifPZ1 {
  border-color: #2ecc71 !important; }

/*# sourceMappingURL=styles.css.map*/%  

with webpack.optimize.UglifyJsPlugin

build/static/app/css/styles.css

.DrIhMabgaalOg4mkpO6Q6{border-color:#16a085!important}._3_TLmw6hMAhtdZvapifPZ1{border-color:#2ecc71!important}
/*# sourceMappingURL=styles.css.map*/%

npm modules

% npm ls --depth=0
test-webpack@1.0.0 /home/user/test-webpack
├── css-loader@0.23.1
├── extract-text-webpack-plugin@1.0.1
├── node-sass@3.4.2
├── sass-loader@3.2.0
├── style-loader@0.13.1
└── webpack@1.13.0

var style = require('./style.scss');
{
"name": "test-webpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "rm -rf build/static && webpack --bail --config webpack.config.js"
},
"author": "",
"license": "ISC",
"devDependencies": {
"css-loader": "^0.23.1",
"extract-text-webpack-plugin": "^1.0.1",
"node-sass": "^3.4.2",
"sass-loader": "^3.2.0",
"style-loader": "^0.13.1",
"webpack": "^1.13.0"
}
}
$turquoise: #1abc9c;
$green-sea: #16a085;
$emerald: #2ecc71;
$colors: (
turquoise: $turquoise,
green-sea: $green-sea,
emerald: $emerald,
);
@each $name, $color in $colors {
.#{$name} {
border-color: $color !important;
}
}
var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
context: __dirname,
devtool: 'source-map',
entry: [
'./src/index.js',
],
output: {
path: path.join(__dirname, 'build', 'static', 'app'),
filename: 'js/app.js',
publicPath: '/static/app/',
library: 'App',
},
plugins: [
new webpack.NoErrorsPlugin(),
new ExtractTextPlugin("css/styles.css"),
//new webpack.optimize.UglifyJsPlugin({
// compressor: {
// screw_ie8: true,
// warnings: false,
// },
//}),
],
resolve: {
extensions: ['', '.js'],
},
resolveLoader: {
'fallback': path.join(path.dirname(__dirname), 'node_modules'),
},
module: {
loaders: [
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract("style-loader", "css-loader?modules!sass-loader"), // production
},
],
},
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment