问题标签 [babel-plugin]

概述

我编写了一个 babel 插件，它为类添加了一个自定义构造函数。我还使用@babel/plugin-proposal-class-properties插件来支持类属性。我的.babelrc样子是这样的：

我正在使用babel-core@7.2.2, 和@babel/plugin-proposal-class-properties@7.2.3.

问题

类属性插件覆盖了我生成的构造函数。例如，给定这个测试文件：

如果我在没有类属性插件的情况下运行，则会插入我的构造函数：

但是如果我取消注释someProp并启用类属性插件，我的自定义代码将被覆盖：

我列出插件的顺序似乎并不重要。这是预期的，有没有办法解决它，或者这是一个错误？

我不认为我的插件的实现很重要 - 但如果确实如此，我可以添加更多细节。

任何帮助表示赞赏。谢谢！

似乎 path.insertAfter()、path.insertBefore()、path.unshiftContainer() 和 path.pushContainer() 仅适用于 Statements。如何插入不是语句的节点？

就我而言，我正在编写一个 babel jsx 插件，并且我正在尝试插入一个兄弟节点，它是一个 JSXExpressionContainer。当我这样做时，我收到以下错误：

TypeError: Property body[0] of BlockStatement expected node to be of a type ["Statement"] but instead got "JSXExpressionContainer"

我该如何解决？

我从这个示例https://github.com/brunolemos/react-native-web-monorepo为 Web、Android 和 iOS 构建了一个跨平台的 monorepo 应用程序，当我将 React Native Base 添加到我的项目中时，我config-overrides.js根据本指南https进行了更改: //docs.nativebase.io/docs/GetStarted.html网页版

但在那之后我得到了 SyntaxError: C:\Users\maksi\Desktop\ecmsk\node_modules\native-base\node_modules\react-native-vector-icons\lib\create-icon-set-from-fontawesome5.js: Support for the experimental syntax 'classProperties' isn't currently enabled错误。

我尝试向插件添加loose选项，@babel/plugin-proposal-class-properties但没有奏效。而且我还尝试添加plugins到我的package.json，但这也不起作用。

包.json

配置覆盖.js

在使用 babel 插件编译我的代码时，我试图插入一个 import 语句。该语句可能会被多次动态插入，所以我必须确保它之前没有被插入。

我曾经path.scope.hasOwnBinding并且path.scope.hasBinding确保它们不会与现有的冲突，但它不适用于动态插入变量。

我希望他们可以检测到我之前插入的变量，但遇到的错误消息是Duplicate declaration AsyncComp

我有我自己的 babel 插件babel.config.js，当我更改插件时，jest 不会选择更新的插件代码并破坏测试。当我运行时 npx jest --no-cache，会获取更新的更改。

我不想--no-cache每次更新插件时都运行。

我很想知道 jest 在 npm artifactory 中更新时如何挑选最新的 babel 插件？

我已经提到了我的插件babel.config.js：

另外，我要对其进行哪些更改jest.config.js以使其选择最新的插件？

I'm using this babel plugin https://github.com/gilbsgilbs/babel-plugin-i18next-extract. Haven't configured it much beyond the basics.

it generates an extractedTranslations folder but I just end up with keys and no values. Is that the correct behavior? I would figure that it would reconcile the values from the translations files that i already have.. I'm kind of confused on how this is useful?

我正在尝试在React Native应用程序中使用ConfirmGoogleCaptcha，安装后出现以下错误：

将 @babel/plugin-proposal-class-properties ( https://git.io/vb4SL ) 添加到 Babel 配置的“插件”部分以启用转换。

我读过的大多数答案都建议将预设和插件添加到.babelrc文件中，这对我不起作用。还有很多答案和文档说babel.config.js可以解决问题，这是我的babel.config.js 文件：

我只想使用babel.config.js文件解决这个问题。

我正在尝试将两个 ant design ui 库与 fixBabelImports 一起使用，即Ant Design(for desktop browser)和Ant Design Mobile(for mobile browser)。我尝试了以下方法，两者都没有控制台错误，但我不确定哪种方法是正确的。

方法一

方法二

我在使用 ant-design 安装 vueJS 时遇到问题，重新启动服务后出现以下错误：

Error: Cannot find module 'babel-plugin-import' from xxx

我的步骤是：

1. 通过安装 vueJS 项目vue ui
2. 通过安装 ant-design 的依赖项vue ui
3. 重新运行服务器

我正在尝试将一些 Ember 代码转换为 React。这就是我想要改造的东西。

从

至

我编写了一个 babel 插件，并尝试Ember.Component.extend用方法生成的 AST 节点替换调用template。这是代码片段。

通天塔插件

输出

ClassDeclaration我得到的语句不是我上面写的预期代码，而是用IIFE. 有什么办法可以去掉IIFE？

我已经为这个问题苦苦挣扎了一整天，但没有办法解决它。

顺便说一句，我也尝试parseExpression了方法，但仍然无法得到我想要的。

通天塔插件

输出

它非常接近正确的代码，除了一对额外的(). 有什么办法可以生成纯的class declaration？