什么是 babel-plugin-syntax-pipeline ？
babel-plugin-syntax-pipeline 是一个 Babel 插件，它提供了对 管道操作符 的语法支持。管道操作符是 ECMAScript 提案中的一个新语法糖，目的是简化函数式编程中的数据流处理。
如何安装 babel-plugin-syntax-pipeline ？
你可以使用 npm 进行安装：
npm install --save-dev babel-plugin-syntax-pipeline
同时，你需要在 .babelrc 文件（Babel 配置文件）中的 plugins 字段中添加配置：
{ "plugins": ["babel-plugin-syntax-pipeline"] }
管道操作符的语法和应用
管道操作符 | 可以在函数或方法调用中使用，它会将调用前面的结果作为参数传递给调用的函数或方法。例如：
let a = 10; let b = a |> (x => x * 2) |> (x => x - 1); // b 的值为 19
在上面的代码中，我们使用 |> 操作符将 a 对象传递给了两个函数 x => x * 2 和 x => x - 1。它们会按照传递顺序依次对 a 进行处理，最终得到 b 的值为 19。
管道操作符不仅可以用于简化数据处理的流程，还可以使代码更加易读。例如，下面这段代码使用了管道操作符，它能够更加清晰地表达出调用顺序：
/(year)-?(month)?-?(day)?/ |> str.match.bind(str) |> ([ , year, month, day ]) => ({ year, month, day }) |> ({ year = new Date().getFullYear(), month = 1, day = 1 }) => new Date(`${year}-${month}-${day}`)
上面的代码解析了一个日期字符串，如果字符串中没有年月日的话，函数会使用当地的时间。管道操作符简化了代码中的函数调用过程，我们可以很容易地明白每一步的操作是什么。
管道操作符的实现方式
管道操作符并不是 ECMAScript 的正式语法，因此在使用管道操作符时，需要使用 Babel 或其他工具来对代码进行转换。babel-plugin-syntax-pipeline 就是一款 Babel 插件，它提供了对管道操作符的语法支持。
在 Babel 转换代码时，管道操作符就会被转换成函数调用。例如，下面这个表达式：
a |> f |> g
转换后的代码如下：
g(f(a))
babel-plugin-syntax-pipeline 插件会将原本无法被解析的管道操作符解析成普通的函数调用，从而使代码能够被正常执行。
总结
管道操作符是 ECMAScript 的一个新语法糖，它能够简化函数式编程中的数据流处理。然而，管道操作符并不是 ECMAScript 正式的语法，因此我们需要使用 Babel 或其它工具来对代码进行转换。babel-plugin-syntax-pipeline 就是一款 Babel 插件，它提供了对管道操作符的编译支持，使我们能够更加方便地使用管道操作符进行数据处理。
示例代码
-- -------------------- ---- ------- ----- ------- - - - ---------- --- -------- ---- -- - ---------- --- -------- ---- -- - ---------- ---- -------- ---- -- -- ----- ------------- - ------ -- ------ -- ------------------- -- -------------- -- ---------------- -- ---------------- -- --------------- -- -- - - --- ----- ---------------- - ---------------------- ------------------------------ -- ---- --- ----展开代码
上面的代码使用管道操作符对 chunks 进行了处理，它们先被过滤掉了不合法的项，然后按照块大小从小到大排序后返回。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005566a81e8991b448d33e9
