mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
Merge pull request #640 from MattStypa/build_refactor
CLI build process improvements
This commit is contained in:
commit
48b72304cb
19
__tests__/cli.compile.test.js
Normal file
19
__tests__/cli.compile.test.js
Normal file
@ -0,0 +1,19 @@
|
||||
import path from 'path'
|
||||
|
||||
import autoprefixer from 'autoprefixer'
|
||||
|
||||
import tailwind from '../src'
|
||||
import compile from '../src/cli/compile'
|
||||
|
||||
describe('cli compile', () => {
|
||||
const inputFile = path.resolve(__dirname, 'fixtures/tailwind-input.css')
|
||||
const outputFile = 'output.css'
|
||||
const plugins = [tailwind(), autoprefixer]
|
||||
|
||||
it('compiles CSS file', () => {
|
||||
return compile({ inputFile, outputFile, plugins }).then(result => {
|
||||
expect(result.css).toContain('.example')
|
||||
expect(result.css).toContain('-ms-input-placeholder')
|
||||
})
|
||||
})
|
||||
})
|
||||
@ -1,4 +1,5 @@
|
||||
import path from 'path'
|
||||
|
||||
import * as utils from '../src/cli/utils'
|
||||
|
||||
describe('cli utils', () => {
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
import autoprefixer from 'autoprefixer'
|
||||
import bytes from 'bytes'
|
||||
import chalk from 'chalk'
|
||||
import postcss from 'postcss'
|
||||
import prettyHrtime from 'pretty-hrtime'
|
||||
|
||||
import tailwind from '../..'
|
||||
|
||||
import commands from '.'
|
||||
import compile from '../compile'
|
||||
import * as emoji from '../emoji'
|
||||
import * as utils from '../utils'
|
||||
|
||||
@ -57,68 +57,37 @@ function stopWithHelp(...msgs) {
|
||||
utils.die()
|
||||
}
|
||||
|
||||
/**
|
||||
* Compiles CSS file.
|
||||
*
|
||||
* @param {string} inputFile
|
||||
* @param {string} configFile
|
||||
* @param {string} outputFile
|
||||
* @param {boolean} autoprefix
|
||||
* @return {Promise}
|
||||
*/
|
||||
function build(inputFile, configFile, outputFile, autoprefix) {
|
||||
const css = utils.readFile(inputFile)
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
postcss([tailwind(configFile)].concat(autoprefix ? [autoprefixer] : []))
|
||||
.process(css, {
|
||||
from: inputFile,
|
||||
to: outputFile,
|
||||
})
|
||||
.then(resolve)
|
||||
.catch(reject)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Compiles CSS file and writes it to stdout.
|
||||
*
|
||||
* @param {string} inputFile
|
||||
* @param {string} configFile
|
||||
* @param {string} outputFile
|
||||
* @param {boolean} autoprefix
|
||||
* @param {CompileOptions} compileOptions
|
||||
* @return {Promise}
|
||||
*/
|
||||
function buildToStdout(inputFile, configFile, outputFile, autoprefix) {
|
||||
return build(inputFile, configFile, outputFile, autoprefix).then(result =>
|
||||
process.stdout.write(result.css)
|
||||
)
|
||||
function buildToStdout(compileOptions) {
|
||||
return compile(compileOptions).then(result => process.stdout.write(result.css))
|
||||
}
|
||||
|
||||
/**
|
||||
* Compiles CSS file and writes it to a file.
|
||||
*
|
||||
* @param {string} inputFile
|
||||
* @param {string} configFile
|
||||
* @param {string} outputFile
|
||||
* @param {boolean} autoprefix
|
||||
* @param {CompileOptions} compileOptions
|
||||
* @param {int[]} startTime
|
||||
* @return {Promise}
|
||||
*/
|
||||
function buildToFile(inputFile, configFile, outputFile, autoprefix, startTime) {
|
||||
function buildToFile(compileOptions, startTime) {
|
||||
utils.header()
|
||||
utils.log()
|
||||
utils.log(emoji.go, 'Building...', chalk.bold.cyan(inputFile))
|
||||
utils.log(emoji.go, 'Building...', chalk.bold.cyan(compileOptions.inputFile))
|
||||
|
||||
return build(inputFile, configFile, outputFile, autoprefix).then(result => {
|
||||
utils.writeFile(outputFile, result.css)
|
||||
return compile(compileOptions).then(result => {
|
||||
utils.writeFile(compileOptions.outputFile, result.css)
|
||||
|
||||
const prettyTime = prettyHrtime(process.hrtime(startTime))
|
||||
|
||||
utils.log()
|
||||
utils.log(emoji.yes, 'Finished in', chalk.bold.magenta(prettyTime))
|
||||
utils.log(emoji.pack, 'Size:', chalk.bold.magenta(bytes(result.css.length)))
|
||||
utils.log(emoji.disk, 'Saved to', chalk.bold.cyan(outputFile))
|
||||
utils.log(emoji.disk, 'Saved to', chalk.bold.cyan(compileOptions.outputFile))
|
||||
utils.footer()
|
||||
})
|
||||
}
|
||||
@ -145,9 +114,15 @@ export function run(cliParams, cliOptions) {
|
||||
!utils.exists(configFile) &&
|
||||
stop(chalk.bold.magenta(configFile), 'does not exist.')
|
||||
|
||||
const compileOptions = {
|
||||
inputFile,
|
||||
outputFile,
|
||||
plugins: [tailwind(configFile)].concat(autoprefix ? [autoprefixer] : []),
|
||||
}
|
||||
|
||||
const buildPromise = outputFile
|
||||
? buildToFile(inputFile, configFile, outputFile, autoprefix, startTime)
|
||||
: buildToStdout(inputFile, configFile, outputFile, autoprefix)
|
||||
? buildToFile(compileOptions, startTime)
|
||||
: buildToStdout(compileOptions)
|
||||
|
||||
buildPromise.then(resolve).catch(reject)
|
||||
})
|
||||
|
||||
39
src/cli/compile.js
Normal file
39
src/cli/compile.js
Normal file
@ -0,0 +1,39 @@
|
||||
import postcss from 'postcss'
|
||||
|
||||
import * as utils from './utils'
|
||||
|
||||
/**
|
||||
* Compiler options
|
||||
*
|
||||
* @typedef {Object} CompileOptions
|
||||
* @property {string} inputFile
|
||||
* @property {string} outputFile
|
||||
* @property {array} plugins
|
||||
*/
|
||||
|
||||
const defaultOptions = {
|
||||
inputFile: null,
|
||||
outputFile: null,
|
||||
plugins: [],
|
||||
}
|
||||
|
||||
/**
|
||||
* Compiles CSS file.
|
||||
*
|
||||
* @param {CompileOptions} options
|
||||
* @return {Promise}
|
||||
*/
|
||||
export default function compile(options = {}) {
|
||||
const config = { ...defaultOptions, ...options }
|
||||
const css = utils.readFile(config.inputFile)
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
postcss(config.plugins)
|
||||
.process(css, {
|
||||
from: config.inputFile,
|
||||
to: config.outputFile,
|
||||
})
|
||||
.then(resolve)
|
||||
.catch(reject)
|
||||
})
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user