Skip to content

Tag: babeljs

Could not find/install babel plugin ‘proposal-decorators’ on CodeSandbox with Firebase

I’m trying to use Codesandbox in React project, but I’m stuck with error: Could not find/install babel plugin ‘proposal-decorators’: Cannot find plugin ‘proposal-decorators’ or ‘babel-plugin-proposal-decorators’. Error happens when I adding firebase utility in the project. On my local machine everythings fine. Here is my code: I tried to: Install babel/plugin-proposal-decorators and add “@babel/plugin-proposal-decorators”: “7.18.2” in dependencies of package.json Install

Instagram embed: React’s JSX doesn’t support namespace tags

I was trying to embed an Instagram post on my React website but I encountered the error “Namespace tags are not supported by default. React’s JSX doesn’t support namespace tags. You can set throwIfNamespace: false to bypass this warning.” Where am I supposed to set throwIfNamespace: false. My first guess is node_modules/react-scripts/webpack.config.js. Where in webpack.config am I supposed to put

MUI5 not working with jest – SyntaxError: Cannot use import statement outside a module

Reproducible repo: What is more worrying is: in the sandbox the tests pass. However if you checkout the above repo, which was imported into this sandbox it will not pass locally. I have no doubt that the issue is my jest does not compile the node_modules that would be needed for running my tests. But I am at

Migrating from Babel to SWC with React

TL;DR How to translate a node script like this: to use SWC instead of Babel? Context We recently upgraded our Next.js version. Next.js now supports SWC instead of Babel. The unit tests for React in our project are written with RITEway. The test command is: It transforms the files with Babel first because otherwise import statements and JSX would cause

What is @babel/plugin-transform-classes?

I run Google PageSpeed Insights on my site, and it reports an issue that is “Avoid serving legacy JavaScript to modern browsers”, as below: I have no idea of what is @babel/plugin-transform-classes, so I search online and it seems babel is a JavaScript compiler and @babel/plugin-transform-classes is a plugin. But I don’t know or install the compiler and the plugin,

Javascript code to AST representation as we do in babelTypes

Every time I want to modify, I have to write t.importDeclaration([t.importDefaultSpecifier(t.identifier(`${importcomponentName}`))], t.stringLiteral(`../components/${importcomponentName}`)) It is just for an import statement. Eg. , if I want to generate a whole component, I have to write a lengthy code that is too long in a file and time-consuming. Do we have any short way to do this by some recursion or library or