/ / Create-reagir-app + reagir-app-religado + datilografado + antd - datilografado, create-react-app, antd

Criar-reagir-app + reagir-app-religado + datilografado + ant-datilografado, criar-reagir-aplicativo, antd

Eu estou tentando começar um projeto e terproblema. Alguém já teve algum sucesso em obter Create-react-app + reagir-app-rewired + typescript + antd trabalhando juntos? Eu tentei sobre cada coisa de tutorial / scripts customizados / loader por aí sem sorte. https://github.com/SZzzzz/react-scripts-ts-antd seria a resposta para todos os meus problemas, mas recebendo este erro de compilação:

(28,81): Type "{ className: string; style: { transition: string | boolean; msTransform: string; WebkitTransform:..." does not satisfy the constraint "HTMLAttributes<HTMLElement>". Types of property "style" are incompatible. Type "{ transition: string | boolean; msTransform: string; WebkitTransform: string; transform: string; }" is not assignable to type "CSSProperties | undefined". Type "{ transition: string | boolean; msTransform: string; WebkitTransform: string; transform: string; }" is not assignable to type "CSSProperties". Types of property "transition" are incompatible. Type "string | boolean" is not assignable to type "string | undefined". Type "true" is not assignable to type "string | undefined".

Respostas:

1 para resposta № 1

nisso


criar-reagir-aplicativo meu-app --scripts-versão = react-scripts-ts cd meu aplicativo fio adicionar antd fio adicionar reagir-app-rewired ts-importação-plugin --dev

adicionar config-overrides.js


const { getLoader, injectBabelPlugin } =require ("react-app-rewired"); const tsImportPluginFactory = require ("ts-import-plugin")  module.exports = override de função (config, env) { // faz coisas com a configuração do webpack ... const tsLoader = getLoader ( config.module.rules, regra => rule.loader && typeof rule.loader === "string" && rule.loader.includes ("ts-loader") );  tsLoader.options = { getCustomTransformers: () => ({ antes: [ tsImportPluginFactory ([{ libraryDirectory: "es", libraryName: "antd", estilo: "css", }]), ] }) };  return config; };

atualizar package.json

"scripts": { "começar": "react-app-rewired start --scripts-versão react-scripts-ts", "build": "reagir-app-rewired construir --scripts-versão react-scripts-ts", "teste": "teste react-app-rewired --env = jsdom --scripts-versão react-scripts-ts", "ejetar": "reagir-scripts-ts ejetar" }