在旧版浏览器上使用 ES6+
Mithril.js 使用 ES5 编写，但完全兼容 ES6 及更高版本。所有现代浏览器都原生支持 ES6+，包括原生模块语法。（它们不支持 Node 的特殊模块解析，因此不能使用 import * as _ from "lodash-es" 或类似的语句，仅支持相对路径和 URL 路径。）因此，你可以自由地使用箭头函数作为闭包组件，以及类作为类组件。
但是，如果需要支持 Internet Explorer 等旧版浏览器，则需要将代码转译为 ES5。本页介绍如何使用 Babel 使现代 ES6+ 代码兼容旧版浏览器。
设置
首先，确保已安装 Node。它自带 npm，我们将会用到它。
下载完成后，打开终端并运行以下命令：
# 将此替换为你的项目的实际路径。如果路径包含空格，请用引号将其引起来；
# 如果你在 Linux/Mac 上，并且路径包含 `$$`，请用单引号将其引起来。
cd "/path/to/your/project"
# 如果你已经有一个 `package.json` 文件，请跳过此命令。
npm init现在，你可以选择以下两种方式之一：
使用 Babel 独立运行
首先，我们需要安装一些依赖项：
@babel/cli：安装核心 Babel 逻辑以及babel命令。@babel/preset-env：帮助 Babel 确定要转译的代码以及如何转译。
npm install @babel/cli @babel/preset-env --save-dev现在，创建一个 .babelrc 文件并使用 @babel/preset-env 进行配置：
{
"presets": ["@babel/preset-env"],
"sourceMaps": true
}最后，如果你对需要支持的浏览器有非常具体的要求，可能需要配置 Browserslist，以便 Babel（和其他库）知道需要支持哪些功能。
默认情况下，如果不进行任何配置，Browserslist 会使用一个相当合理的查询：> 0.5%, last 2 versions, Firefox ESR, not dead。除非你有特殊情况需要更改此设置，例如需要使用大量 polyfill 来支持 IE 8，否则无需进行此步骤。
每次要编译项目时，运行以下命令即可：
babel src --out-dir dist可以使用 npm 脚本来简化操作，避免重复输入命令。在 package.json 文件的 "scripts" 对象中添加一个 "build" 字段：
{
"scripts": {
"build": "babel src --out-dir dist"
}
}这样，运行命令就更容易记忆：
npm run build使用 Babel 和 Webpack
如果想使用 Webpack 进行打包，则需要更多步骤来设置。首先，我们需要安装 Babel 和 Webpack 所需的所有依赖项：
webpack：核心 Webpack 代码。@babel/core：核心 Babel 代码，是babel-loader的同级依赖。babel-loader：让 Webpack 知道如何使用 Babel 来转译你的文件。@babel/preset-env：帮助 Babel 确定要转译的代码以及如何转译。
npm install webpack webpack-cli @babel/core babel-loader @babel/preset-env --save-dev现在，创建一个 .babelrc 文件并使用 @babel/preset-env 进行配置：
{
"presets": ["@babel/preset-env"],
"sourceMaps": true
}接下来，如果你对需要支持的浏览器有非常具体的要求，可能需要配置 Browserslist，以便 Babel（和其他库）知道需要支持哪些功能。
默认情况下，如果不进行任何配置，Browserslist 会使用一个相当合理的查询：> 0.5%, last 2 versions, Firefox ESR, not dead。除非你有特殊情况需要更改此设置，例如需要使用大量 polyfill 来支持 IE 8，否则无需进行此步骤。
最后，创建一个名为 webpack.config.js 的文件来设置 Webpack：
const path = require('path');
module.exports = {
entry: path.resolve(__dirname, 'src/index.js'),
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'app.js',
},
module: {
rules: [
{
test: /\.js$/,
exclude: /\/node_modules\//,
use: {
loader: 'babel-loader',
},
},
],
},
};此配置假定应用程序入口点的源代码文件位于 src/index.js 中，并将 bundle 输出到 dist/app.js。
现在，要运行打包器，只需运行以下命令：
webpack -d --watch可以使用 npm 脚本来简化操作，避免重复输入命令。在 package.json 文件的 "scripts" 对象中添加一个 "start" 字段：
{
"scripts": {
"start": "webpack -d --watch"
}
}这样，运行命令就更容易记忆：
npm start对于生产版本，你需要压缩你的脚本。幸运的是，这也很简单：只需使用不同的选项来运行 Webpack。
webpack -p你可能还想将此添加到你的 npm 脚本中，以便可以快速轻松地构建它。
{
"scripts": {
"start": "webpack -d --watch",
"build": "webpack -p"
}
}这样，运行命令就更容易记忆：
npm run build当然，你也可以在自动化的生产构建脚本中添加此命令。例如，如果你使用 Heroku，它可能是这样的：
{
"scripts": {
"start": "webpack -d --watch",
"build": "webpack -p",
"heroku-postbuild": "webpack -p"
}
}