From 5b44ee101fafc9a62ff124d5324c94f7453b29d9 Mon Sep 17 00:00:00 2001 From: Jake Jarvis Date: Thu, 9 Jan 2020 09:20:56 -0500 Subject: [PATCH] use postcss via hugo pipes instead of cli --- assets/sass/components/_fonts.scss | 2 +- assets/sass/pages/_home.scss | 3 ++- layouts/partials/head.html | 3 +-- layouts/partials/styles.html | 2 ++ package.json | 11 +------- postcss.config.js | 26 ++++++++++++++++++ yarn.lock | 43 +++++++++++++++++++++--------- 7 files changed, 63 insertions(+), 27 deletions(-) create mode 100644 layouts/partials/styles.html create mode 100644 postcss.config.js diff --git a/assets/sass/components/_fonts.scss b/assets/sass/components/_fonts.scss index 58f8befb..6f1831f5 100644 --- a/assets/sass/components/_fonts.scss +++ b/assets/sass/components/_fonts.scss @@ -1,6 +1,6 @@ @charset "UTF-8"; -/*! Roboto Latin | Apache License 2.0 | fonts.google.com/specimen/Roboto */ +/*! Roboto Latin | Apache License 2.0 | https://fonts.google.com/specimen/Roboto */ @include font-face("Roboto", "Roboto", "Roboto-Regular", "./fonts/roboto-latin-regular", normal, 400); @include font-face("Roboto", "Roboto Medium", "Roboto-Medium", "./fonts/roboto-latin-medium", normal, 500); @include font-face("Roboto", "Roboto Bold", "Roboto-Bold", "./fonts/roboto-latin-bold", normal, 700); diff --git a/assets/sass/pages/_home.scss b/assets/sass/pages/_home.scss index be147511..7c914b11 100644 --- a/assets/sass/pages/_home.scss +++ b/assets/sass/pages/_home.scss @@ -66,7 +66,8 @@ main#home { // easter egg emoji cursor &#birthday { &:hover { - cursor: url("data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIzNiIgdmlld3BvcnQ9IjAgMCAxMDAgMTAwIiBzdHlsZT0iZm9udC1zaXplOjE4cHgiPjx0ZXh0IHk9IjUwJSI+8J+nmjwvdGV4dD48L3N2Zz4=") 5 5, auto; + // stylelint-disable-next-line function-url-quotes + cursor: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIzNiIgdmlld3BvcnQ9IjAgMCAxMDAgMTAwIiBzdHlsZT0iZm9udC1zaXplOjE4cHgiPjx0ZXh0IHk9IjUwJSI+8J+nmjwvdGV4dD48L3N2Zz4=) 5 5, auto; } } } diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 05ae2c21..39cf361c 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -13,8 +13,7 @@ -{{ $style := resources.Get "sass/main.scss" | resources.ToCSS (dict "targetPath" "style.css") }} - +{{ partial "styles" . }} diff --git a/layouts/partials/styles.html b/layouts/partials/styles.html new file mode 100644 index 00000000..3b99111f --- /dev/null +++ b/layouts/partials/styles.html @@ -0,0 +1,2 @@ +{{ $style := resources.Get "sass/main.scss" | resources.ToCSS (dict "targetPath" "style.css") | resources.PostCSS (dict "config" "postcss.config.js") }} + diff --git a/package.json b/package.json index 3e7d3ac1..40153c8a 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,6 @@ "start": "hugo server --buildDrafts --buildFuture --port 1313 --bind 0.0.0.0 --verbose", "optimize": "run-s optimize:**", "optimize:html": "html-minifier --html5 --collapse-whitespace --collapse-boolean-attributes --preserve-line-breaks --minify-css --file-ext html --input-dir public --output-dir public **/*.html", - "optimize:css": "postcss public/style.css --use autoprefixer --no-map --replace --verbose && sleep 10 && cleancss -O0 --format 'keep-breaks' -o public/style.css public/style.css", "optimize:img": "find public/ -type d | xargs -n1 -P8 -I{} imagemin {}/* --plugin=jpegoptim --plugin.jpegoptim.progressive --plugin.jpegoptim.stripAll --plugin=pngquant --plugin.pngquant.speed=5 --plugin.pngquant.strip --plugin=optipng --plugin.optipng.optimizationLevel=2 --plugin=svgo --plugin=gifsicle --out-dir={}", "lint": "run-p lint:**", "lint:markdown": "markdownlint content/notes/**/*.md", @@ -34,7 +33,6 @@ "dependencies": {}, "devDependencies": { "autoprefixer": "^9.7.3", - "clean-css-cli": "^4.3.0", "cross-env": "^6.0.3", "get-folder-size": "^2.0.1", "html-minifier": "^4.0.0", @@ -50,6 +48,7 @@ "markdownlint-cli": "~0.21.0", "netlify-cli": "^2.27.0", "npm-run-all": "^4.1.5", + "postcss-clean": "^1.1.0", "postcss-cli": "^7.1.0", "rimraf": "^3.0.0", "stylelint": "~12.0.1", @@ -64,13 +63,5 @@ }, "hugo-bin": { "buildTags": "extended" - }, - "postcss": { - "plugins": { - "autoprefixer": {}, - "stylelint": { - "configFile": ".stylelintrc.json" - } - } } } diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 00000000..35a18ace --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,26 @@ +module.exports = { + options: { + map: false + }, + plugins: [ + require('autoprefixer')(), + require('postcss-clean')({ + compatibility: '*', + level: 0, + format: { + breaks: { + afterAtRule: true, + afterBlockBegins: true, + afterBlockEnds: true, + afterComment: true, + afterRuleEnds: true, + beforeBlockEnds: true + }, + spaces: { + beforeBlockBegins: true + }, + semicolonAfterLastProperty: true + } + }) + ] +}; diff --git a/yarn.lock b/yarn.lock index 4a61dd0d..61b850d0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1447,16 +1447,7 @@ class-utils@^0.3.5: isobject "^3.0.0" static-extend "^0.1.1" -clean-css-cli@^4.3.0: - version "4.3.0" - resolved "https://registry.yarnpkg.com/clean-css-cli/-/clean-css-cli-4.3.0.tgz#8502aa86d1879e5b111af51b3c2abb799e0684ce" - integrity sha512-8GHZfr+mG3zB/Lgqrr27qHBFsPSn0fyEI3f2rIZpxPxUbn2J6A8xyyeBRVTW8duDuXigN0s80vsXiXJOEFIO5Q== - dependencies: - clean-css "^4.2.1" - commander "2.x" - glob "7.x" - -clean-css@^4.2.1: +clean-css@^4.2.1, clean-css@^4.x: version "4.2.1" resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.1.tgz#2d411ef76b8569b6d0c84068dabe85b0aa5e5c17" integrity sha512-4ZxI6dy4lrY6FHzfiy1aEOXgu4LIsW2MhwG0VBKdcoGoH/XLFgaHSdLTGr4O8Be6A8r3MOphEiI8Gc1n0ecf3g== @@ -1681,7 +1672,7 @@ colors@^1.1.2: resolved "https://registry.yarnpkg.com/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78" integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA== -commander@2.x, commander@^2.11.0, commander@^2.19.0, commander@^2.3.0, commander@~2.20.3: +commander@^2.11.0, commander@^2.19.0, commander@^2.3.0, commander@~2.20.3: version "2.20.3" resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33" integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ== @@ -3370,7 +3361,7 @@ glob-to-regexp@^0.3.0: resolved "https://registry.yarnpkg.com/glob-to-regexp/-/glob-to-regexp-0.3.0.tgz#8c5a1494d2066c570cc3bfe4496175acc4d502ab" integrity sha1-jFoUlNIGbFcMw7/kSWF1rMTVAqs= -glob@7.x, glob@^7.1.3, glob@^7.1.4, glob@^7.1.6, glob@~7.1.2: +glob@^7.1.3, glob@^7.1.4, glob@^7.1.6, glob@~7.1.2: version "7.1.6" resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.6.tgz#141f33b81a7c2492e125594307480c46679278a6" integrity sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA== @@ -6542,6 +6533,14 @@ posix-character-classes@^0.1.0: resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab" integrity sha1-AerA/jta9xoqbAL+q7jB/vfgDqs= +postcss-clean@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/postcss-clean/-/postcss-clean-1.1.0.tgz#c2d61d5d8caf19a585adba16897726c2674c4207" + integrity sha512-83g3GqMbCM5NL6MlbbPLJ/m2NrUepBF44MoDk4Gt04QGXeXKh9+ilQa0DzLnYnvqYHQCw83nckuEzBFr2muwbg== + dependencies: + clean-css "^4.x" + postcss "^6.x" + postcss-cli@^7.1.0: version "7.1.0" resolved "https://registry.yarnpkg.com/postcss-cli/-/postcss-cli-7.1.0.tgz#769b07b8865aaa3e98c7c63a3d256b4f51e3e237" @@ -6684,7 +6683,25 @@ postcss-values-parser@^1.5.0: indexes-of "^1.0.1" uniq "^1.0.1" -postcss@^7.0.0, postcss@^7.0.14, postcss@^7.0.17, postcss@^7.0.2, postcss@^7.0.21, postcss@^7.0.23, postcss@^7.0.7: +postcss@^6.x: + version "6.0.23" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324" + integrity sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag== + dependencies: + chalk "^2.4.1" + source-map "^0.6.1" + supports-color "^5.4.0" + +postcss@^7.0.0, postcss@^7.0.14, postcss@^7.0.2, postcss@^7.0.21, postcss@^7.0.23, postcss@^7.0.7: + version "7.0.24" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.24.tgz#972c3c5be431b32e40caefe6c81b5a19117704c2" + integrity sha512-Xl0XvdNWg+CblAXzNvbSOUvgJXwSjmbAKORqyw9V2AlHrm1js2gFw9y3jibBAhpKZi8b5JzJCVh/FyzPsTtgTA== + dependencies: + chalk "^2.4.2" + source-map "^0.6.1" + supports-color "^6.1.0" + +postcss@^7.0.17: version "7.0.26" resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.26.tgz#5ed615cfcab35ba9bbb82414a4fa88ea10429587" integrity sha512-IY4oRjpXWYshuTDFxMVkJDtWIk2LhsTlu8bZnbEJA4+bYT16Lvpo8Qv6EvDumhYRgzjZl489pmsY3qVgJQ08nA==