在前端开发中，babel 是一款非常常用的编译器。通过 babel，我们可以使用新的 ECMAScript 特性，并将其转译成能被主流浏览器理解的代码。babel-preset-yarus 是一款在 babel 中使用的预设包，本文将详细介绍它的用法和配置，帮助前端开发者更好的运用它。
安装和配置
首先，我们需要在项目中安装 babel 和 babel-preset-yarus：
npm install babel-core babel-preset-yarus --save-dev
安装完毕后，我们需要在 .babelrc 文件中指定使用 yarus 预设包：
{
"presets": ["yarus"]
}如果想要修改预设包的一些选项，可以在 .babelrc 中添加如下内容：
-- -------------------- ---- -------
-
---------- -
-
--------
-
------ -
---------- - --------- ---- -
-
-
-
-
-这样，我们便完成了 babel-preset-yarus 的安装和基本配置。接下来，我们将介绍 yarus 的几个主要特性。
常用特性
支持最新 ECMAScript
yarus 预设包支持最新的 ECMAScript，包括 ECMAScript 2015、2016、2017 和最新的 ECMAScript 2018 特性。这样，我们可以在项目中使用最新的 JavaScript 语言特性，提高开发效率和代码可维护性。
支持 React
yarus 预设包还支持 React。我们只需要在 .babelrc 文件中添加如下配置：
{
"presets": ["yarus", "react"]
}这样，我们就可以在 React 项目中使用最新的 ECMAScript 特性，同时也支持 JSX 语法。
内置优化配置
yarus 预设包还内置了一些优化配置，从而提升转码效率和代码质量。例如，它自动引入了 transform-runtime 插件，从而避免了代码中可能出现的重复引入 polyfill 的问题。我们只需要在项目中添加如下配置：
{
"presets": ["yarus"]
}这样，我们就可以享受自动化的转码优化，提升代码质量和性能。
示例代码
最后，我们来看一下使用 babel-preset-yarus 的示例代码。下面是一个简单的 ES6 模块：
// math.js export const add = (a, b) => a + b; export const subtract = (a, b) => a - b;
我们只需要将 .babelrc 文件中的配置修改为：
{
"presets": ["yarus"]
}然后，在使用该模块的文件中，我们便可以直接使用 import 和 export 语句了：
// main.js
import { add, subtract } from './math';
console.log(add(1, 2)); // 输出 3
console.log(subtract(3, 2)); // 输出 1通过 babel-preset-yarus，我们可以使用最新的 ECMAScript 特性，提升开发效率和代码质量。祝您在前端之路上越来越厉害！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600672673660cf7123b36575