汇总是否支持汇总配置文件中的打字稿？答案

【问题标题】：Does rollup support typescript in rollup config file?汇总是否支持汇总配置文件中的打字稿？
【发布时间】：2019-07-09 17:18:57
【问题描述】：

看来我们可以使用 typescript 来编写汇总配置文件。比如说，我可以创建一个名为rollup.config.ts 的文件，内容为：

import typescript from 'rollup-plugin-typescript2';

export default {
  input: 'main.ts',
  plugins: [typescript()],
  output: {
    file: 'bundle.js',
    format: 'cjs',
  },
  external: ['lodash']
}

如果我以 rollup -c rollup.config.ts 调用汇总，它会起作用。

但如果我在其中使用一些类型：

import typescript from 'rollup-plugin-typescript2';
import {RollupFileOptions} from "rollup";

const config: RollupFileOptions = {
  input: 'main.ts',
  plugins: [typescript()],
  output: {
    file: 'bundle.js',
    format: 'cjs',
  },
  external: ['lodash']
}

export default config;

它会报告如下错误：

$ rollup -c rollup.config.ts
[!] Error: Unexpected token
rollup.config.ts (4:12)
2: import {RollupFileOptions} from "rollup";
3: 
4: const config: RollupFileOptions = {
                 ^

有可能让它工作吗？我尝试将 ts-node 与

一起使用

【问题讨论】：

您找到解决方案了吗？我面临类似的问题（无法导入另一个 ts 文件）
@Moustachiste 还没有，我现在必须使用rollup.config.js
我在 rollup 的网站上看到这没有被跟踪，所以我打开了一个问题 github.com/rollup/rollup/issues/2879

标签： typescript rollup

【解决方案1】：

与此同时，虽然它尚不支持，但 JSDoc 可能对类型检查汇总配置很有用。（它只适用于支持 JSDoc 的编辑器。例如 VSCode）。

/** @type {import('rollup').RollupOptions} */
const options = {
  ...
};

export default options;

【讨论】：

tyck 似乎无法正常工作。 const options = { output: { dir: 42 } }; dir 必须是string，是number，但是在vscodium中没有显示错误。

【解决方案2】：

您可以创建一个单独的rollup.config.js，如下所示：

require('ts-node').register({
  compilerOptions: {
    module: 'CommonJS'
  },
  // and other tsconfig.json options as you like
});

module.exports = require('./rollup.config.ts');

您当然需要npm install --save-dev ts-node。然后运行npx rollup -c，您就可以参加比赛了。

【讨论】：

【解决方案3】：

使用Rollup v2.52.0，您可以将--configPlugin 选项指定为：

rollup --config rollup.config.ts --configPlugin typescript

【讨论】：

这似乎不起作用，我仍然收到错误[!] Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)。能举个例子吗？
为此，您需要安装 @rollup/plugin-typescript 和 typescript 作为开发依赖项。

【解决方案4】：

这实际上是可能的，只需从rollup 导入defineConfig，这将为您提供很好的IDE 建议，例如：

//rollup.config.js

import { defineConfig } from 'rollup';

const rollupConfig = defineConfig({
  input: 'src/index.tsx',
  output: [
    {
      file: 'dist/bundle.cjs.js',
      format: 'cjs',
    },
  ],
});

export default rollupConfig;

【讨论】：

【解决方案5】：

为了获得最快的编译速度，请使用：

npm install sucrase -D

在您的rollup.config.js 中，执行以下操作：

require('sucrase/register')
module.exports = require('./rollup.config.ts')

https://github.com/alangpierce/sucrase

【讨论】：