tsx不能直接 import Comp from './Comp' 必须要写全路径才行是为什么?

Question

问题描述

不能

import Demo from './Comp';

也不能

import Demo from './Comp/index';

必须要

import Demo from './Comp/index.tsx';

才能运行不然就提示 Module not found: Error: Can't resolve './Comp/index' 或者 './Comp'
webpack 配置了

...
 {
                test: /\.(tsx?)$/,
                loader: 'ts-loader'
            }, {
                test: /\.(js|jsx)$/,
                loader: 'babel-loader'
            }
            ...
resolve: {
        extensions: ['tsx','.ts','.js', '.jsx'],
        mainFiles: ["index"]
    },

用的是 webpack4 之前用 webpack3 也有这个问题

tsconfig 配置如下

{
  "compilerOptions": {
    "baseUrl": ".",
    "outDir": "./dist",
    "module": "esnext",
    "target": "es5",
    "lib": ["es6", "dom"],
    "sourceMap": true,
    "allowJs": true,
    "jsx": "react",
    "moduleResolution": "node",
    "rootDir": "src",
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "importHelpers": true,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": true
  },
  "exclude": [
    "node_modules",
    "publish",
    "config"
  ]
}

我只是想能和 js的 import 一样 但是不知道为什么一直是这样,求指教

Answer 1

extensions: ['tsx','.ts','.js', '.jsx']
tsx -> .tsx