css - 使用Grunt构建手写笔主题

我想让我的手写笔文件接受来自grunt的变量输入，循环变量值，并输出不同的主题CSS文件。

然后，我可以轻松地像这样切换主题。 https://stackoverflow.com/a/7847009/55124

这可能吗？如何设置？

现在，我开始将手写笔编译到CSS中。但是，要生成不同的主题，我必须在mainCSS.stylus文件中手动更改themeName变量的值，并使用grunt进行重建。

最佳答案

您如何看待这种方式：

有一个main.styl，其中包含：

@import "variables";
//some other styles and imports

并且有一些主题文件：

 themes/default.styl
 themes/pretty-theme.styl
 themes/very-pretty-theme.styl

使用grunt-contrib-copy，您可以将文件themes / default.styl复制到variable.styl，然后将手写笔编译为css样式，然后再删除variables.styl，然后再次将theme / pretty-theme.styl复制到variables.styl和编译等等。

copy: {
  default-theme: {
    src: 'themes/default.styl',
    dest: 'variables.styl',
  },
  pretty-theme: {
    src: 'themes/pretty-theme.styl',
    dest: 'variables.styl',
  },
  very-theme: {
    src: 'themes/very-pretty-theme',
    dest: 'variables.styl',
  },
}