我们目前正在尝试将babel-plugin-styled-components集成到我们的打字稿和基于create-react-app的设置中,以获得更好的调试体验,我们遇到了困难.
我们不愿意弹出应用程序,这就是我们尝试使用react-app-rewired设置它的原因,我们还设法使用react-app-rewire-typescript和react-app-rewire来编译我们的打字稿代码-styled组件.
但是出于某种原因,不应用displayName,这使我觉得不应用babel插件.
我们使用“start”:“react-app-rewired start”作为我们的开发服务器脚本,config-overrides.js如下所示:
const rewireTypescript = require('react-app-rewire-typescript'); const rewireStyledComponents = require('react-app-rewire-styled-components'); module.exports = function override(config,env) { return rewireTypescript(rewireStyledComponents(config,env),env); }
我不知道我们缺少什么.交换重新布线…封装的功能也没有帮助.
这里有没有人有经验或能指出我正确的方向?
如果你使用webpack,我找到了一个不需要使用babel的解决方案.
原文链接:https://www.f2er.com/react/300871.htmlhttps://github.com/Igorbek/typescript-plugin-styled-components
要使用它,您可以使用webpack向您的打字机加载器添加自定义转换:
module: { rules: [ { test: /\.tsx?$/,loader: 'awesome-typescript-loader',options: { getCustomTransformers: () => ({ before: [styledComponentsTransformer] }) } }