TS1259+TS6142: Module can only be default-imported using the 'esModuleInterop

今天发现代码 

import React, { Component } from "react";

提示eslint 报错

网上搜了一下，说建议  

import * as React
class Index extends React.Component<PageProps,PageState> {}

但是，这肯定不对劲

TS1259:  '.....'    Module can only be default-imported using the 'esModuleInterop' flag

类似的情况还有：https://github.com/SoftwareBrothers/adminjs/issues/233

This module is declared with using 'export =', and can only be used with a default import when using the 'esModuleInterop' flag.

其实值需要修改：

{
  "compilerOptions": {
    "esModuleInterop":true,
    "jsx": "react"
  },}

其中 jsx react 是解决 TS6142:but '--jsx' is not set 问题的关键

具体参看：https://stackoverflow.com/questions/50432556/cannot-use-jsx-unless-the-jsx-flag-is-provided

还有就是 react  Component 类型声明报错

class Index extends Component<PageProps,PageState> {}

报语法错误

这个是bable 配置问题

// babel-preset-taro 更多选项和默认值：
// https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md
module.exports = {
  presets: [
    ['taro', {
      framework: 'react',
      ts: true
    }]
  ]
}

需要 配置ts 为true

转载本站文章《TS1259+TS6142: Module can only be default-imported using the 'esModuleInterop》,
请注明出处：https://www.zhoulujun.cn/html/tools/Bundler/webpack/2021_1110_8698.html