diff --git a/__tests__/customConfig.test.js b/__tests__/customConfig.test.js index b757dff25..6eec9c94d 100644 --- a/__tests__/customConfig.test.js +++ b/__tests__/customConfig.test.js @@ -1,7 +1,20 @@ +import fs from 'fs' import path from 'path' import postcss from 'postcss' import tailwind from '../src/index' +function inTempDirectory(callback) { + return new Promise(resolve => { + fs.mkdirSync(path.resolve('./__tmp')) + process.chdir(path.resolve('./__tmp')) + callback().then(() => { + process.chdir(path.resolve('../')) + fs.rmdirSync(path.resolve('./__tmp')) + resolve() + }) + }) +} + test('it uses the values from the custom config file', () => { return postcss([tailwind(path.resolve(`${__dirname}/fixtures/custom-config.js`))]) .process( @@ -25,7 +38,6 @@ test('it uses the values from the custom config file', () => { } } ` - expect(result.css).toMatchCss(expected) }) }) @@ -65,3 +77,43 @@ test('custom config can be passed as an object', () => { expect(result.css).toMatchCss(expected) }) }) + +test('tailwind.config.js is picked up by default', () => { + return inTempDirectory(() => { + fs.writeFileSync( + path.resolve('./tailwind.config.js'), + `module.exports = { + theme: { + screens: { + mobile: '400px', + }, + }, + }` + ) + + return postcss([tailwind]) + .process( + ` + @responsive { + .foo { + color: blue; + } + } + `, + { from: undefined } + ) + .then(result => { + expect(result.css).toMatchCss(` + .foo { + color: blue; + } + @media (min-width: 400px) { + .mobile\\:foo { + color: blue; + } + } + `) + fs.unlinkSync(path.resolve('./tailwind.config.js')) + }) + }) +}) diff --git a/src/index.js b/src/index.js index 1985aee55..09530af5b 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,5 @@ import path from 'path' +import fs from 'fs' import _ from 'lodash' import postcss from 'postcss' @@ -8,31 +9,50 @@ import registerConfigAsDependency from './lib/registerConfigAsDependency' import processTailwindFeatures from './processTailwindFeatures' import resolveConfig from './util/resolveConfig' -const plugin = postcss.plugin('tailwind', config => { - const plugins = [] - - if (!_.isUndefined(config) && !_.isObject(config)) { - plugins.push(registerConfigAsDependency(path.resolve(config))) +function resolveConfigPath(filePath) { + if (_.isObject(filePath)) { + return undefined } - const getConfig = () => { - if (_.isUndefined(config)) { - return resolveConfig([require('../defaultConfig')()]) - } + if (!_.isUndefined(filePath)) { + return path.resolve(filePath) + } - if (!_.isObject(config)) { - delete require.cache[require.resolve(path.resolve(config))] - } + try { + const defaultConfigPath = path.resolve('./tailwind.config.js') + fs.accessSync(defaultConfigPath) + return defaultConfigPath + } catch (err) { + return undefined + } +} - return resolveConfig([ - _.isObject(config) ? config : require(path.resolve(config)), - require('../defaultConfig')(), - ]) +const getConfigFunction = config => () => { + if (_.isUndefined(config) && !_.isObject(config)) { + return resolveConfig([require('../defaultConfig')()]) + } + + if (!_.isObject(config)) { + delete require.cache[require.resolve(config)] + } + + return resolveConfig([ + _.isObject(config) ? config : require(config), + require('../defaultConfig')(), + ]) +} + +const plugin = postcss.plugin('tailwind', config => { + const plugins = [] + const resolvedConfigPath = resolveConfigPath(config) + + if (!_.isUndefined(resolvedConfigPath)) { + plugins.push(registerConfigAsDependency(resolvedConfigPath)) } return postcss([ ...plugins, - processTailwindFeatures(getConfig), + processTailwindFeatures(getConfigFunction(resolvedConfigPath ? resolvedConfigPath : config)), perfectionist({ cascade: true, colorShorthand: true,