babel 7 在使用 typescript 插件进行汇总时不会进行转译

Question

我似乎无法让 rollup-plugin-babel 在我的打字稿项目中工作。.ts 代码编译并汇总包，生成映射文件，但 babel 不会转译它。

另外，如果我运行npx babel lab.js --out-file lab-es5.jsbabel 似乎工作得很好。

这是我的 rollup.config.js

import commonjs from 'rollup-plugin-commonjs';
import nodeResolve from 'rollup-plugin-node-resolve';
import typescript from 'rollup-plugin-typescript2'
import sourcemaps from 'rollup-plugin-sourcemaps';
import babel from 'rollup-plugin-babel';

var plugins = [
    nodeResolve({
        module: true,
        jsnext: true,
        main: true,
        preferBuiltins: false
    }),
    commonjs({
        include: 'node_modules/**',  // Default: undefined
        ignoreGlobal: false,  // Default: false
    }),
    typescript(/*{ plugin options }*/),
    babel({
        exclude: 'node_modules/**',
        runtimeHelpers: true
    }),
    sourcemaps()
];

export default [
    {
        input: 'src/lab.ts',
        plugins,
        output: {
            name: "TablePager",
            file: 'lab.js',
            format: 'iife',
            sourcemap: true
        }
    }
];

这是我的 .babelrc

{
    "presets": ["@babel/preset-env"]
}

如果您有任何关于我做错了什么的线索，我将不胜感激。

Answer 1

说明

默认情况下，@rollup/plugin-babel启用以下扩展：

.js
.jsx
.es6
.es
.mjs

因此，@rollup/plugin-babel与 一起使用时，有两件事需要设置@rollup/plugin-typescript。

1. 您必须告诉它使用 TypeScript 扩展（默认情况下未启用）。
2. 您必须告诉它您要转译哪些文件。

由于某些原因，文档说默认情况下所有文件都会被转译。对于具有 TypeScript 扩展名的文件，情况并非如此。所以你必须设置include手动设置该选项。

幸运的是，对于第二个选项，您可以告诉它使用全局模式。设置文件夹不起作用。

例子

这是一个例子。在此上下文中，所有要转译的 TypeScript 文件都位于该src文件夹中。

.js
.jsx
.es6
.es
.mjs

链接

• 汇总文档。
• 用于 Rollup 文档的 Babel 插件。
• 用于汇总文档的 TypeScript 插件。