pinafore/bin/build-sass.js
Nolan Lawson bb7fe6e30a
chore: make build process faster/simpler (#833)
This gets rid of the awkward checking-in of `template.html` to git (when
it's a built file) and also makes the rebuilds faster and more
consistent by running everything through the same pipeline. So inline
CSS, SVG, and JS are all partially built on-the-fly.

I've basically reinvented gulp, but it's pretty lightweight and
zero-dep, so I'm happy with it.
2018-12-17 17:21:29 -08:00

46 lines
1.8 KiB
JavaScript
Executable file

#!/usr/bin/env node
import sass from 'node-sass'
import path from 'path'
import fs from 'fs'
import pify from 'pify'
const writeFile = pify(fs.writeFile.bind(fs))
const readdir = pify(fs.readdir.bind(fs))
const render = pify(sass.render.bind(sass))
const globalScss = path.join(__dirname, '../scss/global.scss')
const defaultThemeScss = path.join(__dirname, '../scss/themes/_default.scss')
const offlineThemeScss = path.join(__dirname, '../scss/themes/_offline.scss')
const customScrollbarScss = path.join(__dirname, '../scss/custom-scrollbars.scss')
const themesScssDir = path.join(__dirname, '../scss/themes')
const assetsDir = path.join(__dirname, '../static')
async function renderCss (file) {
return (await render({ file, outputStyle: 'compressed' })).css
}
async function compileGlobalSass () {
let mainStyle = (await Promise.all([defaultThemeScss, globalScss].map(renderCss))).join('')
let offlineStyle = (await renderCss(offlineThemeScss))
let scrollbarStyle = (await renderCss(customScrollbarScss))
return `<style>\n${mainStyle}</style>\n` +
`<style media="only x" id="theOfflineStyle">\n${offlineStyle}</style>\n` +
`<style media="all" id="theScrollbarStyle">\n${scrollbarStyle}</style>\n`
}
async function compileThemesSass () {
let files = (await readdir(themesScssDir)).filter(file => !path.basename(file).startsWith('_'))
await Promise.all(files.map(async file => {
let res = await render({ file: path.join(themesScssDir, file), outputStyle: 'compressed' })
let outputFilename = 'theme-' + path.basename(file).replace(/\.scss$/, '.css')
await writeFile(path.join(assetsDir, outputFilename), res.css, 'utf8')
}))
}
export async function buildSass () {
let [ result ] = await Promise.all([compileGlobalSass(), compileThemesSass()])
return result
}