Object | Function
const tailwind = {
content: [
'./config/html/**/*.html',
'./config/html/**/*.ejs',
'./config/html/**/*.hbs',
'./src/**/*.js',
'./src/**/*.jsx',
'./src/**/*.ts',
'./src/**/*.tsx',
'./storybook/**/*',
],
// 使用 source.designSystem 配置作为 Tailwind CSS Theme 配置
theme: source.designSystem,
};
对应 TailwindCSS 的配置。
当 tools.tailwindcss
为 Function 类型时,默认配置会作为第一个参数传入,你可以直接修改配置对象,也可以返回一个值作为最终结果:
export default {
tools: {
tailwindcss(config) {
config.content.push('./some-folder/**/*.{js,ts}');
},
},
};
当 tools.tailwindcss
的值为 Object
类型时,会与默认配置通过 Object.assign
浅合并。
export default {
tools: {
tailwindcss: {
plugins: [
require('@tailwindcss/forms'),
require('@tailwindcss/aspect-ratio'),
require('@tailwindcss/typography'),
],
},
},
};
注意,该配置中不允许使用 theme
配置项,否则会构建失败。在 Modern.js 中,请使用 source.designSystem 作为 Tailwind CSS Theme
配置。
其他配置的使用方式和 Tailwind CSS 一致,请参考 tailwindcss - Configuration。