如何以编程方式运行TailwindCSS并处理指定示例输入？

以下是几种常见场景下的实现方式，可根据你的具体需求选择：

1. 拆分独立指令 #

将连续的指令字符串拆分为单独的指令项，便于后续逐个处理：

Python实现 #

input_str = "@tailwind base;@tailwind components;@tailwind utilities;"
# 按分号拆分并过滤空内容
commands = [cmd.strip() for cmd in input_str.split(';') if cmd.strip()]
print(commands)
# 输出结果: ['@tailwind base', '@tailwind components', '@tailwind utilities']

JavaScript实现 #

const inputStr = "@tailwind base;@tailwind components;@tailwind utilities;";
const commands = inputStr.split(';').filter(cmd => cmd.trim()).map(cmd => cmd.trim());
console.log(commands);
// 输出结果: ['@tailwind base', '@tailwind components', '@tailwind utilities']

2. 修改指令内容 #

比如替换指令前缀、修改指令名称等：

Python示例（替换前缀） #

input_str = "@tailwind base;@tailwind components;@tailwind utilities;"
commands = [cmd.strip() for cmd in input_str.split(';') if cmd.strip()]
# 替换指令前缀
modified_commands = [cmd.replace('@tailwind', '@custom-tailwind') for cmd in commands]
# 重新拼接为原格式字符串
output_str = ';'.join(modified_commands) + ';'
print(output_str)
# 输出结果: '@custom-tailwind base;@custom-tailwind components;@custom-tailwind utilities;'

3. 验证指令格式合法性 #

检查输入是否符合标准的Tailwind指令格式：

Python实现（正则验证） #

import re

input_str = "@tailwind base;@tailwind components;@tailwind utilities;"
# 匹配标准Tailwind指令格式的正则表达式
pattern = r'^(@tailwind\s+(base|components|utilities);)+$'
is_valid = re.fullmatch(pattern, input_str) is not None
print(is_valid)  # 输出结果: True

内容的提问来源于stack exchange，提问作者Foobar