Tsx cannot directly import Comp from'. / Comp' must write full path. Why?

problem description

cannot

import Demo from "./Comp";

cannot

import Demo from "./Comp/index";

must be

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

to run, otherwise prompt Module not found: Error: Can"t resolve". / Comp/index" or". / Comp"
webpack is configured

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

uses webpack4 before using webpack3 also has the same problem

tsconfig is configured as follows

{
  "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"
  ]
}

I just want to be the same as js"s import, but I don"t know why it"s always the same. Ask for advice


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

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b33070-2be54.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b33070-2be54.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?