1

我正在创建一个CSS 库,我想像 RxJS 一样支持子包。例如,使用 RxJS,我们可以像这样导入整个厨房水槽(取自https://www.npmjs.com/package/rxjs):

var Rx = require('rxjs/Rx'); 
Rx.Observable.of(1,2,3); // etc

或者像这样的个体运营商:

var Observable = require('rxjs/Observable').Observable;
// patch Observable with appropriate methods
require('rxjs/add/observable/of');
require('rxjs/add/operator/map');

我最初的观察是,这可能就像将模块打包到根模块的子文件夹中一样简单。例如RxJS node_modules安装文件夹有一个子文件夹rxjs/add/observable,其中包含所有可观察的扩展,如zip.js, throw.js...等。

因此,遵循这种模式postcss-import可以扩展以以相同的方式解析子模块文件夹中的导入。例如:

  • @import @superflycss/utilities-layout/margins

将导入node_modules/superflycss/utilities-layout/margins.css,如果不存在,它将查找node_modules/superflycss/utilities-layout/margins/index.css,如果不存在,则会引发错误。

  • @import @superflycss/utilities-layout/margins/

只会进口node_modules/superflycss/utilities-layout/margins/index.css

我正在生产的模块将厨房水槽打包在目录中target/main/css/index.css。这会公开所有 css 实用程序或组件(取决于它是什么类型的模块)。

问题是,与 RxJS 一样,这可能是一个非常重的文件(例如,包含对所有 Google 字体的导入)。

所以我希望通过遵循 RxJS 方法,通过遵循 NodeJS require.resolv() 算法使用的相同规则,整个事情变得更加灵活和标准化。想法?

4

1 回答 1

0

PostCSS 确实支持导入子模块,就像 RxJS 一样。我添加了一个带有测试用例的拉取请求,说明了它是如何在此处完成的。

于 2018-01-26T21:26:40.273 回答