Как создать переменные, которые будут видимы в SASS, JavaScript и Jade(Pug)

Каким наиболее простым образом можно создать переменные, которые будут видимы в:
SASS JavaScript-файлах (с использованием Webpack и возможностей ES6) Jade-шаблонах
Зачем это надо, думаю понятно: меняем имя, например, CSS-класса в одном месте, и оно автоматически подставляется везде. Без этой возможности изменить имя класса в крупном проекте - целая проблема.

Ответ

создаете файл .env и в нем переменную SOME_ENV_VAR к примеру SASS_ENV=blabla
читаем переменную в компиляторе SASS или JS: var ENV = process.env.SOME_ENV_VAR || 'default';
асайним переменную для Jade:
const express = require('express'); var app = express(); app.locals.env = process.env;
и читаем переменную в Jade #{env.SOME_ENV_VAR}
Дополнение #1
var sass = encodeURIComponent(jsonToSassVars(sassGlobals)); var webpackConfig = { module: { loaders:[ {test: /.scss$/, loader: "style!css!sass!prepend?data=" + sass} ] }, }
jsonToSassVars - https://gist.github.com/Kasu/ea4f4861a81e626ea308
Update: the previous link is not available anymore, prefer to use https://gist.github.com/ali-master/cb54a3501c0ea29a88a0297cb9533be9