小编Mus*_*ett的帖子

我有一系列已转换为打字稿的反应项目。其中一些使用 webpack，而其中一些只使用 babel，因为它们是其他（webpack）项目/实际应用程序使用的库。

除了在一个非 webpack 项目中，我收到错误“导入路径不能以 .tsx 扩展名结尾”，例如在

import LoadingLogo from '../ui/LoadingLogo.tsx';

我可以通过省略扩展名或使用 // @ts-ignore 来解决这个问题，但这些都不是最佳解决方案，因为该项目在重构时将是 jsx 和 tsx 的混合，我想成为能够一目了然地看到导入中使用的文件类型。

我将项目转换为打字稿的步骤是

1. 安装打字稿
2. 安装@babel/preset-typescript
3. 添加

presets: [ @babel/preset-typescript ]

到我的 babel.config.js

更令人困惑的是，在其他（非 webpack）应用程序之一中，我运行了相同的 babel 设置，但我没有看到这个问题。有什么明显的我遗漏了吗？作为参考，我在有问题的项目中的 babel.config 看起来像这样

module.exports = function(api) {
  api.cache(true);

  return {
    ignore: ['node_modules/**/*'],
    presets: [
      ['@babel/preset-typescript'],
      [
        '@babel/preset-env',
        {
          loose: true,
          targets: {
            node: 'current'
          }
        }
      ],
      '@babel/preset-react'
    ],
    env: {
      translations: {
        plugins: [
          'syntax-async-functions',
          '@babel/plugin-syntax-dynamic-import',
          'dynamic-import-node',
          [
            'react-intl',
            {
              messagesDir: './messages',
              enforceDescriptions: false
            }
          ] …