Question

我在 .bablerc

{
  "presets": [...],
  "plugins": [
    [
      "@babel/plugin-transform-runtime",
      {
        "corejs": false,
        "helpers": true,
        "regenerator": true,
        "useESModules": false
      }
    ],
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
    ["@babel/plugin-proposal-class-properties", { "loose": true }],
    ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": true }],
    "@babel/plugin-transform-react-jsx"
  ]
}

但是设置AntD Table jsx时locale.emptyText代码编译失败（属性值可以是rc-table中所述的 React.Node或Function ）

import { Table } in 'antd'
<Table
  locale={{ emptyText=<div><img src="..."></div> }}
>

错误：

Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /path/to/page.js: Unexpected token (77:31)

  75 |             dataSource={dataSource}
  76 |             loading={false}
> 77 |             locale={{ emptyText=<div><img src=""></div> }}
     |                                ^

另外，我知道如果以函数形式编写则可以使用：

locale={{ emptyText: () => <div><img src=""></div> }}

Answer 1

您的代码中有一个错字，locale属性需要一个对象，因此键值对应以:而非=分隔

locale={{ emptyText: <div><img src="..."></div> }}

应该工作

Answer 2

locale={{ emptyText=<div><img src=""></div> }}
                   ^

错误消息很清楚，您使用的是=而不是:

Babel React jsx配置不起作用

2 个答案: