汇总错误：“无法解析”index.ts 内 .js 和 .jsx 文件引用的错误

Question

我正在尝试使用旧版本的 React 汇总并发布一个存储库，该版本使用纯 .js 和 .jsx 文件。它还有一些打字稿文件。我已经遵循了本教程，但向应用程序添加了一个 js 文件和 jsx 文件，并在 src 文件夹中引用它们的 index.ts 。 （我将 @rollup/plugin-babel 添加到汇总配置中以处理 jsx 文件。）这是我的 index.ts：

export * from './components';

// The below line gives an "Could not resolve" error when you run `npm run rollup`
export * from './path-to/my/jsfile.js';

// If you comment out the above line you get a similar error but for this jsx file.
export * from './path-to/my/jsxfile.jsx';

当我尝试执行

rollup -c

命令时，我收到一条错误消息

dist/esm/types/index.d.ts → dist/index.d.ts...
[!] Error: Could not resolve './path-to/my/jsfile.js' from dist/esm/types/index.d.ts

当我注释掉 jsfile.js 导出行时，出现错误：

dist/esm/types/index.d.ts → dist/index.d.ts...
[!] Error: Could not resolve './path-to/my/jsxfile.jsx' from dist/esm/types/index.d.ts

这是我的汇总配置：

import resolve from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import typescript from "@rollup/plugin-typescript";
import postcss from "rollup-plugin-postcss";
import dts from "rollup-plugin-dts";
import { babel } from '@rollup/plugin-babel';

const packageJson = require("./package.json");

export default [
  {
    input: "src/index.ts",
    output: [
      {
        file: packageJson.main,
        format: "cjs",
        sourcemap: true,
      },
      {
        file: packageJson.module,
        format: "esm",
        sourcemap: true,
      },
    ],
    plugins: [
      resolve({extensions: ['.js', '.ts']}),
      babel({ babelHelpers: 'bundled', extensions: [".js", ".jsx"], }),
      commonjs(),
      typescript({ tsconfig: "./tsconfig.json" }),
      postcss(),
    ],
  },
  {
    input: "dist/esm/types/index.d.ts",
    output: [{ file: "dist/index.d.ts", format: "esm" }],
    plugins: [dts()],
    external: [/\.(css|less|scss)$/],
  },
];

如何将 js 和 jsx 文件与 ts 文件一起汇总？

Answer 1

将文件从

file.d.ts

重命名为

file.ts

。