我们目前正在尝试将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://github.com/Igorbek/typescript-plugin-styled-components
要使用它,您可以使用webpack向您的打字机加载器添加自定义转换：
module: {
rules: [
{
test: /\.tsx?$/,loader: 'awesome-typescript-loader',options: {
getCustomTransformers: () => ({ before: [styledComponentsTransformer] })
}
}
