turbo (实验性功能)

警告：这些功能处于实验阶段，仅在 next --turbo 命令下生效。

webpack 加载器

目前，Turbopack 支持 webpack 加载器 API 的一个子集，允许您使用部分 webpack 加载器在 Turbopack 中转换代码。

要配置加载器，请在 next.config.js 中添加已安装的加载器名称及其选项，将文件扩展名映射到加载器列表：

next.config.js

module.exports = {
  experimental: {
    turbo: {
      rules: {
        // 带选项的格式
        '*.md': [
          {
            loader: '@mdx-js/loader',
            options: {
              format: 'md',
            },
          },
        ],
        // 无选项的格式
        '*.mdx': ['@mdx-js/loader'],
      },
    },
  },
}

配置完成后，您可以在应用中使用转换后的代码：

import MyDoc from './my-doc.mdx'

export default function Home() {
  return <MyDoc />
}

解析别名

通过 next.config.js，可以配置 Turbopack 通过别名修改模块解析方式，类似于 webpack 的 resolve.alias 配置。

要配置解析别名，在 next.config.js 中将导入模式映射到新目标：

next.config.js

module.exports = {
  experimental: {
    turbo: {
      resolveAlias: {
        underscore: 'lodash',
        mocha: { browser: 'mocha/browser-entry.js' },
      },
    },
  },
}

这将把 underscore 包的导入别名指向 lodash 包。换句话说，import underscore from 'underscore' 会加载 lodash 模块而非 underscore。

Turbopack 还支持通过此字段进行条件别名配置，类似于 Node.js 的条件导出。目前仅支持 browser 条件。在上例中，当 Turbopack 针对浏览器环境时，mocha 模块的导入会被别名指向 mocha/browser-entry.js。

有关如何从 webpack 迁移应用到 Turbopack 的更多信息和指导，请参阅 Turbopack 关于 webpack 兼容性的文档。

webpack 加载器

解析别名

On this page