From 433907cf253f36f975bffc5c60313b26ce93914f Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Sun, 25 Aug 2019 08:48:35 +0300 Subject: [PATCH 1/2] Output CSS in `/static/css` --- build.js | 4 ++-- layouts/partials/html-head.hbs | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/build.js b/build.js index 643f54ee82cf..af2fd78a0245 100755 --- a/build.js +++ b/build.js @@ -257,8 +257,8 @@ function buildLayouts () { paths: [path.join(__dirname, 'layouts', 'css')], use: [autoprefixer()] })) - // Pipes the generated files into /build/layouts/css. - .destination(path.join(__dirname, 'build', 'layouts', 'css')) + // Pipes the generated files into /build/static/css. + .destination(path.join(__dirname, 'build/static/css')) // This actually executes the build and stops the internal timer after // completion. diff --git a/layouts/partials/html-head.hbs b/layouts/partials/html-head.hbs index ae7c7e4e57ce..6b330d9569fe 100644 --- a/layouts/partials/html-head.hbs +++ b/layouts/partials/html-head.hbs @@ -6,7 +6,7 @@ - + From 5238577d56a295e2ea2f4a1fbe3fef1e45f4bd4d Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Thu, 5 Sep 2019 21:18:39 +0300 Subject: [PATCH 2/2] Switch to using stylus directly. --- build.js | 63 ++++++++++++----------- package-lock.json | 9 ---- package.json | 4 +- scripts/plugins/filter-stylus-partials.js | 16 ------ 4 files changed, 35 insertions(+), 57 deletions(-) delete mode 100644 scripts/plugins/filter-stylus-partials.js diff --git a/build.js b/build.js index af2fd78a0245..e1b892088411 100755 --- a/build.js +++ b/build.js @@ -4,8 +4,9 @@ // BUILD.JS: This file is responsible for building static HTML pages +const fs = require('fs') +const path = require('path') const Metalsmith = require('metalsmith') -const autoprefixer = require('autoprefixer-stylus') const collections = require('metalsmith-collections') const feed = require('metalsmith-feed') const discoverHelpers = require('metalsmith-discover-helpers') @@ -13,18 +14,16 @@ const discoverPartials = require('metalsmith-discover-partials') const layouts = require('metalsmith-layouts') const markdown = require('metalsmith-markdown') const prism = require('metalsmith-prism') -const stylus = require('metalsmith-stylus') const permalinks = require('metalsmith-permalinks') const pagination = require('metalsmith-yearly-pagination') const defaultsDeep = require('lodash.defaultsdeep') +const autoprefixer = require('autoprefixer-stylus') const marked = require('marked') -const path = require('path') -const fs = require('fs') +const stylus = require('stylus') const ncp = require('ncp') const junk = require('junk') const navigation = require('./scripts/plugins/navigation') -const filterStylusPartials = require('./scripts/plugins/filter-stylus-partials') const anchorMarkdownHeadings = require('./scripts/plugins/anchor-markdown-headings') const loadVersions = require('./scripts/load-versions') const latestVersion = require('./scripts/helpers/latestversion') @@ -238,33 +237,37 @@ function githubLinks (options) { } // This function builds the layouts folder for all the Stylus files. -function buildLayouts () { - console.log('[metalsmith] build/layouts started') - const labelForBuild = '[metalsmith] build/layouts finished' +function buildCSS () { + console.log('[stylus] static/css started') + const labelForBuild = '[stylus] static/css finished' console.time(labelForBuild) fs.mkdir(path.join(__dirname, 'build'), () => { - fs.mkdir(path.join(__dirname, 'build', 'layouts'), () => { - const metalsmith = Metalsmith(__dirname) - metalsmith - // Sets the build source as /layouts/css. - .source(path.join(__dirname, 'layouts', 'css')) - // Deletes Stylus partials since they'll be included in the main CSS - // file anyways. - .use(filterStylusPartials()) - .use(stylus({ - compress: process.env.NODE_ENV !== 'development', - paths: [path.join(__dirname, 'layouts', 'css')], - use: [autoprefixer()] - })) - // Pipes the generated files into /build/static/css. - .destination(path.join(__dirname, 'build/static/css')) + fs.mkdir(path.join(__dirname, 'build/static'), () => { + fs.mkdir(path.join(__dirname, 'build/static/css'), () => { + fs.readFile(path.join(__dirname, 'layouts/css/styles.styl'), 'utf8', (err, data) => { + if (err) { + throw err + } + + stylus(data) + .set('compress', process.env.NODE_ENV !== 'development') + .set('paths', [path.join(__dirname, 'layouts/css')]) + .use(autoprefixer()) + .render((error, css) => { + if (error) { + throw error + } - // This actually executes the build and stops the internal timer after - // completion. - metalsmith.build((err) => { - if (err) { throw err } - console.timeEnd(labelForBuild) + fs.writeFile(path.join(__dirname, 'build/static/css/styles.css'), css, (err) => { + if (err) { + throw err + } + + console.timeEnd(labelForBuild) + }) + }) + }) }) }) }) @@ -313,8 +316,8 @@ function fullBuild (opts) { const { selectedLocales, preserveLocale } = opts // Build static files. copyStatic() - // Build layouts - buildLayouts() + // Build CSS + buildCSS() getSource((err, source) => { if (err) { throw err } diff --git a/package-lock.json b/package-lock.json index fd3f23c46ed9..6da97c036f4e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3291,15 +3291,6 @@ } } }, - "metalsmith-stylus": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/metalsmith-stylus/-/metalsmith-stylus-3.0.0.tgz", - "integrity": "sha1-45Ssj3Og7ebj2Di6vt07MQv1ykI=", - "requires": { - "minimatch": "^3.0.3", - "stylus": "^0.54.5" - } - }, "metalsmith-yearly-pagination": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/metalsmith-yearly-pagination/-/metalsmith-yearly-pagination-4.0.0.tgz", diff --git a/package.json b/package.json index affc6bfa25d6..7f0c1fc7bf46 100644 --- a/package.json +++ b/package.json @@ -53,7 +53,6 @@ "metalsmith-metadata": "0.0.4", "metalsmith-permalinks": "^2.2.0", "metalsmith-prism": "^3.1.1", - "metalsmith-stylus": "^3.0.0", "metalsmith-yearly-pagination": "^4.0.0", "ncp": "^2.0.0", "node-version-data": "^1.1.0", @@ -63,7 +62,8 @@ "require-dir": "^1.2.0", "semver": "^6.3.0", "st": "^1.2.2", - "strftime": "^0.10.0" + "strftime": "^0.10.0", + "stylus": "^0.54.7" }, "devDependencies": { "cross-env": "^6.0.0", diff --git a/scripts/plugins/filter-stylus-partials.js b/scripts/plugins/filter-stylus-partials.js deleted file mode 100644 index 8de1e0487806..000000000000 --- a/scripts/plugins/filter-stylus-partials.js +++ /dev/null @@ -1,16 +0,0 @@ -'use strict' - -const path = require('path') - -module.exports = function filterStylusPartials () { - return (files, metalsmith, done) => { - Object.keys(files).forEach((filename) => { - const isPartial = (/^_.*\.styl(us)?/).test(path.basename(filename)) - if (isPartial) { - delete files[filename] - } - }) - - done() - } -}