其實為啥是從右往左，而不從左往右，只是Webpack選擇了compose方式，而不是pipe的方式而已，在技術上實現從左往右也不會有難度

在Uninx有pipeline的概念，平時應該也有接觸，比如?ps aux | grep node，這些都是從左往右的。

但是在函數式編程中有組合的概念，我們數學中常見的f(g(x))，在函數式編程一般的實現方式是從右往左，如

const compose = (...fns) => x => fns.reduceRight((v, f) => f(v), x);

const add1 = n => n + 1; //加1

const double = n => n * 2; // 乘2

const add1ThenDouble = compose(

? double,

? add1

);

add1ThenDouble(2); // 6

// ((2 + 1 = 3) * 2 = 6)?

這里可以看到我們先執行的加1，然后執行的double，在compose中是采用reduceRight，所以我們傳入參數的順序編程了先傳入double，后傳入add1

那么其實也可以實現從左往右

const pipe = (...fns) => x => fns.reduce((v, f) => f(v), x);

const add1ThenDouble = pipe(

? add1,

? double

);

add1ThenDouble(2); // 6

// ((2 + 1 = 3) * 2 = 6)

所以只不過webpack選擇了函數式編程的方式，所以loader的順序編程了從右往左，如果webpack選擇了pipe的方式，那么大家現在寫loader的時候的順序就變成從左往右了

• compose :?require("style-loader!css-loader!sass-loader!./my-styles.sass");

• pipe :?require("./my-styles.sass!sass-loader!css-loader!style-loader");