Encountering Babel issues while incorporating npm package into React Native project

Currently, I am developing a React Native application.

In an attempt to enhance my application, I decided to incorporate the npm package available at this link: https://github.com/MagicTheGathering/mtg-sdk-javascript/

Despite trying various import statements like import { card } from 'mtgsdk';, none seem to be working as intended.

The error that keeps popping up is as follows:

TransformError: /myproject/node_modules/mtgsdk/lib/index.js: Couldn't find preset "es2015" relative to directory /myproject/node_modules_mtgsdk

I am seeking guidance on the correct method of importing this package into my project. What aspect am I missing in terms of imports within javascript?

javascriptnpmreact-native

Answer №1

Your Babel might not be aware of the specific plugins you plan to use.

To address this, it's recommended to include a .babelrc file at the root of your project with the following configuration:

{
  "presets": ["es2015"]
}

Also, remember to run the command:

npm install babel-preset-es2015 --save-dev

This should hopefully resolve any issues you encounter with Babel.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Error: Unable to access property 'count.' because it is undefined

componentDidMount(props) { this.interval = setInterval(() => { if (props.count !== 0) { this.stateHandler() } }, 1000) } Encountering an issue with the interval, as the console is displaying the following error: Type ...

javascripthtmlnode.jsreactjs

Incorporate several websites into a React application without using iframes

After developing a React application with create-react-app, I attempted to embed another website onto the app using an iframe. Everything worked perfectly until I wanted to resize the iframe to fit the page, resulting in a Blocked a frame with origin from ...

javascriptreactjsiframereact-redux

Accessing variables from outside the query block in Node.js with SQLite

I'm looking to retrieve all the rows from a table and store them in an array called "arr". I need to access this stored array outside of the query section. Is there a way for me to get all the rows outside of the db.each function so that I can continu ...

javascriptjquerynode.jssqlite

Is it possible to create Interactive Tabs using a Global BehaviorSubject?

Trying to adjust tab visibility based on different sections of the Ionic app, an approach involving a global boolean BehaviorSubject is being utilized. The encapsulated code has been condensed for brevity. In the provider/service globals.ts file, the foll ...

javascriptangularionic-frameworkionic2

Why will the experimental activation of React concurrent features in Nextjs 12 disable API routes?

I just upgraded to Next.js version 12 and set up some API routes (e.g. "/api/products"). These routes were functioning properly, but when I enabled concurrentFeatures: true in my next.config.ts, the API routes stopped working. The console display ...

javascriptreactjstypescriptnext.js

What advantages does the Step function (AWS) offer compared to setTimeout (Javascript) for scheduling tasks?

I am currently in the process of developing an API service that allows any client to provide me with their HTTP request along with the desired time in seconds for execution. I have considered two potential approaches to achieve this: Utilizing a lambda f ...

javascriptamazon-web-servicesaws-lambdaaws-step-functions

What are the steps to turn off response data compression in an Express server?

How can I receive the 'Content-Length' response from the server without gzip compression enabled? I am using a compression middleware for this purpose: const shouldCompress = (req, res) => { if(req.headers['x-no-comprassion']) { ...

javascriptexpressserver

An issue arose while installing a node.js package called Hummusjs

I'm encountering an issue while attempting to install the 'hummus' package using the command: npm install -g hummus The error message from the logs reads as follows: 1926 verbose stack Error: <a href="/cdn-cgi/l/email-protection" class ...

node.jsnpmhummus.js

The request's body in the PUT method is void

I seem to be having an issue with my PUT request. While all my other requests are functioning properly, the req.body appears to remain empty, causing this error message to occur: errmsg: "'$set' is empty. You must specify a field like so: ...

javascriptnode.jsmongodbexpressput

``There seems to be an issue with the functionality of Passport.js' multiple login system

I'm encountering a strange issue with my login system. Everything seems to be working fine, including local login, Google login, and Facebook login. However, the problem arises when I attempt to register with Google after already registering with Face ...

javascriptnode.jsmongodbmongoosepassport.js

Issue encountered following Node.js installation: Module 'es6-promisify' not found in npm

After installing the latest version of Node.js on my Windows system, I encountered a recurring exception. Every command I tried resulted in the same error message. For example, when I typed "npm -v," I received the following error: Cannot find module &apos ...

node.jsnpmvisual-studio-codenode-promisify

Is there a way to verify the presence of multiple array indices in React with TypeScript?

const checkInstruction = (index) => { if(inputData.info[index].instruction){ return ( <Text ref={instructionContainerRef} dangerouslySetInnerHTML={{ __html: replaceTextLinks(inputData.info[index].instruction) ...

javascriptreactjstypescript

Sign up a new user using Passport JS

Looking to utilize passport.js for adding a new user from the signup page. The signup form is as follows: <form id="Signup-form" name="SignupForm" action="/signup" method="post"/> <input type="text" id="firstname" name="Firstname" > <input ...

javascriptnode.jsexpressauthenticationpassport.js

Rails: Ensure that JSON form fields remain populated in case the form encounters a validation error

I am using a rails simple form to create a product with three fields inside in order to associate it with appropriate categories: <div class="form-group"> <%= f.input :child_category_id, :collection => @categories.order(:name), :l ...

javascriptjqueryruby-on-railsjsonajax

The issue of Angular's ng-repeat view not refreshing after a search query remains unresolved

Having some trouble with updating a results array in AngularJS using a service call. After submitting a form and calling the service, I set up my callbacks with .then() on the promise object. However, the view only updates when I start deleting characters ...

javascriptangularjspromise

Creating dynamic grids in React.js by utilizing HTML

Currently, I am tackling one of the projects on FCC which is the Game of Life. Prior to diving in, my focus is on figuring out how to render a grid on the page. I aim to modify the table dimensions while ensuring it fits neatly within its container. The ...

javascripthtmlcssreactjscss-tables

The checkValidity function fails to identify incorrect "tel" input

In my form, I am using the checkValidity function to validate inputs. However, I have encountered an issue where the validation only works when an input with the required attribute is missing a value. It doesn't work if there is a value type mismatch, ...

javascriptjqueryhtmlformsvalidation

I can't seem to locate the datepicker in Material UI Next. Can you point

I'm attempting to use the next branch of Material UI from https://github.com/callemall/material-ui/tree/next. I need to utilize the layout component, but it seems that the DatePicker component is missing. How can I include the DatePicker in the next b ...

javascriptreactjsmaterial-ui

Unexpected values being returned by Javascript/jQuery variables

Struggling with understanding scope in JavaScript, like many others before me. It can be quite challenging to navigate through the code at times. I've reviewed previous discussions on this topic, but I'm still having trouble applying it to my spe ...

javascriptjqueryajaxasynchronousscope

Tips for sending data from Jade to a Node.js endpoint function

I am unfamiliar with Express and I am trying to figure out how to pass the user's username from a Jade file to an endpoint function in my JavaScript file. Below is the code for the endpoint function in index.js: router.get('/userdetail', fu ...

javascriptangularjsnode.jsexpresspug