Get rid of build warnings and upgrade postcss - Fixes #90

jdan · Feb 28, 2017 · 493293d · 493293d
1 parent ca04af5
commit 493293d
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 23 deletions.
diff --git a/package.json b/package.json
@@ -9,7 +9,7 @@
   "author": "Jordan Scales <scalesjordan@gmail.com>",
   "devDependencies": {
     "accessibility-developer-tools": "2.9.0-rc.0",
-    "autoprefixer-loader": "^2.0.0",
+    "autoprefixer": "^6.5.3",
     "babel": "^5.6.7",
     "babel-core": "^5.0.12",
     "babel-loader": "^5.0.0",
@@ -22,17 +22,17 @@
     "less": "^2.5.0",
     "less-loader": "^2.2.0",
     "mocha": "^2.2.5",
-    "postcss": "^4.1.11",
-    "postcss-loader": "^0.4.3",
+    "postcss": "^5.2.6",
+    "postcss-loader": "^1.1.1",
     "script-loader": "^0.6.1",
     "style-loader": "^0.10.1",
     "webpack": "^1.8.4",
     "webpack-dev-server": "^1.9.0"
   },
   "scripts": {
     "build": "npm run prod && npm run dev",
-    "prod": "webpack --config webpack.config.babel.js -p",
-    "dev": "webpack --config webpack.config.babel.js -d --devtool hidden --output-file=tota11y.js",
+    "prod": "NODE_ENV=production webpack --config webpack.config.babel.js",
+    "dev": "webpack --config webpack.config.babel.js -d --devtool hidden --output-filename=tota11y.js",
     "lint": "eslint index.js plugins test utils",
     "test": "mocha --require test/babel-hook test/*.js",
     "live-test": "webpack-dev-server --config webpack.config.babel.js --hot --inline"

diff --git a/webpack.config.babel.js b/webpack.config.babel.js
@@ -3,13 +3,14 @@ let handlebars = require("handlebars");
 let path = require("path");
 let postcss = require("postcss");
 let webpack = require("webpack");
+let autoprefixer = require("autoprefixer");
 
 let options = require("./utils/options");
 
 // PostCSS plugin to append !important to every CSS rule
 let veryimportant = postcss.plugin("veryimportant", function() {
     return function(css) {
-        css.eachDecl(function(decl) {
+        css.walkDecls(function(decl) {
             decl.important = true;
         });
     };
@@ -18,6 +19,30 @@ let veryimportant = postcss.plugin("veryimportant", function() {
 let bannerTemplate = handlebars.compile(
     fs.readFileSync("./templates/banner.handlebars", "utf-8"));
 
+const plugins = [
+    // Add a banner to our bundles with a version number, date, and
+    // license info
+    new webpack.BannerPlugin(
+        bannerTemplate({
+            version: require("./package.json").version,
+            date: new Date().toISOString().slice(0, 10),
+        }),
+        {entryOnly: true}),
+
+    // Make the JSX pragma function available everywhere without the need
+    // to use "require"
+    new webpack.ProvidePlugin({
+        [options.jsxPragma]: path.join(__dirname, "utils", "element"),
+    }),
+];
+
+if (process.env.NODE_ENV === "production") {
+    plugins.push(
+        // Suppress uglifyJS warnings from node_modules/
+        new webpack.optimize.UglifyJsPlugin({compress: {warnings: false}})
+    )
+}
+
 module.exports = {
     entry: {
         app: "./index.js",
@@ -39,25 +64,13 @@ module.exports = {
             { test: /\.handlebars$/, loader: "handlebars", },
             {
                 test: /\.less$/,
-                loader: "style!css!postcss!autoprefixer?{browsers:['> 1%']}!less",
+                loader: "style!css!postcss!less",
             },
         ],
     },
-    plugins: [
-        // Add a banner to our bundles with a version number, date, and
-        // license info
-        new webpack.BannerPlugin(
-            bannerTemplate({
-                version: require("./package.json").version,
-                date: new Date().toISOString().slice(0, 10),
-            }),
-            {entryOnly: true}),
-
-        // Make the JSX pragma function available everywhere without the need
-        // to use "require"
-        new webpack.ProvidePlugin({
-            [options.jsxPragma]: path.join(__dirname, "utils", "element"),
-        }),
+    plugins,
+    postcss: [
+        veryimportant,
+        autoprefixer({browsers: ["> 1%"]}),
     ],
-    postcss: [veryimportant],
 };