css-theme通过单个css文件生成多组主题并合并成一个css文件。切换主题体积压缩，合并多套css，去除冗余代码，避免文件体积膨胀，低侵入，不改变现有开发模式，一次修改，全局效果安装$npmicss-theme--save-dev即可使用css编写在需要改变主题的css中使用占位符，占位符可以是任意字符串。您还可以通过预处理器变量将这些占位符注入到css文件中。@dark:#theme1;@light:#theme2;.container{.text1{字体大小：16px;颜色：#theme1；行高：正常；}.text2{字体大小：14px；颜色：@dark；行高：正常；}.text2{字体大小：14px；颜色：@light；行高：正常；}}gulpplugin模式在gulp任务中调用主题插件。参见demo/gulpvarcssTheme=require('css-theme').gulp;//gulp-pluginvarthemeConfig=require('./theme.config');//configsless({plugins:[newLessPluginTheme(themeConfig)]})less插件模式在通过gulp/webpack等工具调用less时插入主题中间件。详情参见demo/lessvarLessPluginTheme=require('css-theme').less;//less-pluginvarthemeConfig=require('./theme.config');//configsgulp.task('default',function(){returngulp.src('./index.less').pipe(less()).pipe(cssTheme(themeConfig)).pipe(gulp.dest('./dist'));});configureplaceholder：占位符，描述css文件中各个变量对应的占位符列表：themelistlist.targetMap：主题中各个变量对应的value列表。rootClass：使用该主题时在顶层添加的classlist。default:是否设置Thistheme作为默认主题，不指定类时默认显示module.exports={'placeholder':{'dark':'#theme1','light':'#theme2'},'list':[{'default':false,'targetMap':{'dark':'#ff6a3a','light':'#ffa284',},'rootClass':'skin_orange'},{'default':false,'targetMap':{'dark':'#fdd000','light':'#ffd71c',},'rootClass':'skin_yellow'}]};链接QuestionsGithub授权MIT
